anentrypoint-design 0.0.201 → 0.0.203

package/app-shell.css

@@ -154,6 +154,9 @@ pre .n { color: var(--green-2); }
    ============================================================ */
 .app {
   display: flex; flex-direction: column;
+  /* Offset parent for the sidebar drawer/scrim/toggle, which are absolute so
+     they overlay THIS shell (a thebird WM window) rather than the viewport. */
+  position: relative;
   min-height: 100vh;
   /* Definite height so the flex column resolves height:100% for descendants
      (e.g. a full-height chat) at every breakpoint, not just where a desktop
@@ -1299,6 +1302,19 @@ table tr.clickable:focus-visible td { background: var(--bg-2); }
 .ds-upload-item.done .ds-upload-pct { color: var(--success); }
 .ds-upload-item.error .ds-upload-fill { background: var(--warn); }
 .ds-upload-item.error .ds-upload-pct { color: var(--warn); }
+/* Per-row upload recovery actions (replace / dismiss) — error rows are not dead ends. */
+.ds-upload-item { grid-template-columns: minmax(0, 1fr) 120px 44px auto; }
+.ds-upload-actions { display: inline-flex; gap: var(--space-1); justify-content: flex-end; }
+.ds-upload-act {
+  padding: 2px 10px; min-height: 24px; cursor: pointer;
+  background: var(--bg); border: var(--bw-hair) solid var(--rule); border-radius: var(--r-1);
+  color: var(--fg-2); font-family: var(--ff-body); font-size: var(--fs-micro);
+}
+.ds-upload-act:hover { background: var(--bg-3); color: var(--fg); }
+.ds-upload-act:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
+@media (hover: none), (pointer: coarse) {
+  .ds-upload-act { min-height: 44px; min-width: 44px; }
+}
 
 /* Empty state */
 .ds-file-empty {
@@ -1356,6 +1372,14 @@ table tr.clickable:focus-visible td { background: var(--bg-2); }
   font-family: inherit; font-size: var(--fs-sm);
 }
 .ds-modal-input:focus { outline: 2px solid var(--accent); outline-offset: 2px; }
+/* In-body modal error (role=alert): mutation failures (409/403) surface INSIDE
+   the dialog, not behind the fixed overlay. */
+.ds-modal-error {
+  margin: var(--space-2) 0 0; padding: 8px 10px;
+  border: var(--bw-hair) solid var(--flame); border-radius: var(--r-2);
+  background: color-mix(in oklab, var(--flame) 12%, var(--bg));
+  color: var(--flame); font-size: var(--fs-xs);
+}
 .btn-primary.danger {
   background: var(--warn);
   border-color: var(--warn);
@@ -1485,10 +1509,12 @@ table tr.clickable:focus-visible td { background: var(--bg-2); }
 .ds-file-row:hover .ds-file-check,
 .ds-file-row:focus-within .ds-file-check,
 .ds-file-check.on { opacity: 1; }
-/* Touch / coarse-pointer devices have no hover — keep checkboxes visible so
-   multi-select is reachable without a pointer. */
+/* Touch / coarse-pointer devices have no hover — keep checkboxes AND the
+   per-row action buttons (rename/delete/download) visible so the file manager
+   is fully reachable without a pointer (e.g. an iPad in landscape). */
 @media (hover: none), (pointer: coarse) {
   .ds-file-check { opacity: 1; }
+  .ds-file-actions { opacity: 1; }
 }
 .ds-file-check.on { background: var(--accent); border-color: var(--accent); }
 .ds-file-row.selected {
@@ -2639,14 +2665,20 @@ input[type="password"]:not(:placeholder-shown) + .input-clear {
    ============================================================ */
 
 /* Tablet + Mobile: side rail becomes off-canvas drawer (≤900px) */
-@media (max-width: 900px) {
+/* Sidebar drawer collapse keys on the SHELL width (@container on .app, which is
+   container-type:inline-size) — NOT the viewport. Full-page (freddie) the shell
+   == viewport so this is identical to the old @media(max-width:900px); embedded
+   in a thebird WM window the drawer + hamburger appear when the WINDOW is narrow
+   even on a wide desktop. Drawer/scrim/toggle are absolute (anchored to .app), so
+   they overlay the window, not the page. */
+@container (max-width: 900px) {
   .app-body,
   .app-body.no-side { grid-template-columns: 1fr !important; }
   .app-side-shell {
-    position: fixed;
+    position: absolute;
     left: 0; top: var(--app-topbar-h);
-    height: calc(100vh - var(--app-topbar-h) - var(--app-status-h));
-    width: 280px; max-width: 80vw;
+    height: calc(100% - var(--app-topbar-h) - var(--app-status-h));
+    width: 280px; max-width: 80%;
     transform: translateX(-100%);
     transition: transform var(--dur-base, 240ms) var(--ease, ease);
     z-index: 50;
@@ -2680,21 +2712,24 @@ input[type="password"]:not(:placeholder-shown) + .input-clear {
   .app-main { padding-left: var(--space-3); padding-right: var(--space-3); }
 }
 
-/* Drawer scrim — lives inside .app-body, shown when drawer open ≤900px */
+/* Drawer scrim — absolute so it covers THIS shell, shown when drawer open and
+   the shell is narrow (@container on .app). */
 .app-side-scrim {
   display: none;
-  position: fixed; inset: 0;
+  position: absolute; inset: 0;
   background: color-mix(in oklab, var(--bg) 60%, transparent);
   z-index: 49;
 }
-@media (max-width: 900px) {
+@container (max-width: 900px) {
   .app-body.side-open .app-side-scrim { display: block; }
 }
 
-/* Mobile nav toggle (hamburger) — hidden on desktop, shown ≤900px */
+/* Nav toggle (hamburger) — hidden when the shell is wide, shown when the shell
+   itself is narrow (@container on .app). Absolute so it sits in THIS shell's
+   topbar, not pinned to the viewport corner. */
 .app-side-toggle {
   display: none;
-  position: fixed; top: calc((var(--app-topbar-h) - 44px) / 2); left: 10px;
+  position: absolute; top: calc((var(--app-topbar-h) - 44px) / 2); left: 10px;
   z-index: 51;
   /* 44x44 minimum hit area (WCAG 2.5.5 / Apple HIG) - 36px is below the
      reliable-tap threshold on touch. */
@@ -2707,7 +2742,7 @@ input[type="password"]:not(:placeholder-shown) + .input-clear {
   cursor: pointer;
 }
 .app-side-toggle:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
-@media (max-width: 900px) {
+@container (max-width: 900px) {
   .app-side-toggle { display: inline-flex; }
   .app-topbar .brand { margin-left: 44px; }
 }

package/chat.css

@@ -541,3 +541,94 @@ button.chat-composer-context:focus-visible { outline: 2px solid var(--accent); o
 @media (pointer: coarse), (max-width: 640px) {
   .ds-session-meta-copy { min-height: 44px; min-width: 44px; }
 }
+
+/* ============================================================================
+   Logic/predictability sweep (2026-06-10): composer ergonomics, turn notices,
+   windowed thread, dashboard stopping/external states, cwd validation.
+============================================================================ */
+
+/* Enter-to-send hint: visible while the composer is focused or carries a
+   draft; hidden under 420px to save rows. */
+.chat-composer-hint {
+  display: none; padding: 2px var(--space-3) 0;
+  font-size: var(--fs-micro); color: var(--fg-3);
+}
+.chat-composer:focus-within .chat-composer-hint,
+.chat-composer.has-draft .chat-composer-hint { display: block; }
+@media (max-width: 420px) {
+  .chat-composer .chat-composer-hint { display: none; }
+}
+
+/* Transient composer note (paste/drop not supported), aria-live polite. */
+.chat-composer-note {
+  padding: 4px var(--space-3); font-size: var(--fs-tiny); color: var(--fg-2);
+}
+
+/* Drag-over ring: token accent, never a hex. */
+.chat-composer.dragover { outline: 2px solid var(--accent); outline-offset: -2px; border-radius: var(--r-2); }
+
+/* Per-bit composer context: only the bit that owns a control is a button. */
+.chat-composer-context-bit {
+  display: inline; padding: 0; margin: 0;
+  background: none; border: none; cursor: pointer;
+  font: inherit; color: inherit; text-decoration: underline dotted;
+}
+.chat-composer-context-bit:hover { color: var(--fg-2); }
+.chat-composer-context-bit:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
+@media (pointer: coarse) {
+  .chat-composer-context-bit { min-height: 44px; }
+}
+
+/* Out-of-band turn notices: neutral tone (NOT error red) — a stopped or
+   incomplete turn must not read as a finished answer. */
+.chat-msg-notice {
+  margin-top: var(--space-1); padding: 6px 10px;
+  border: var(--bw-hair) solid var(--rule); border-radius: var(--r-2);
+  background: var(--bg-2); color: var(--fg-2); font-size: var(--fs-tiny);
+}
+.chat-msg-notice.is-incomplete { border-style: dashed; }
+
+/* Tail-window streaming head ('streaming · N KB so far'). */
+.chat-stream-head {
+  padding: 2px 0 6px; font-family: var(--ff-mono);
+  font-size: var(--fs-micro); color: var(--fg-3);
+}
+
+/* Windowed thread: 'show N earlier turns' control at the top. */
+.agentchat-earlier {
+  display: flex; align-items: center; justify-content: center;
+  gap: var(--space-3); padding: var(--space-2) var(--space-3);
+}
+.agentchat-earlier-count { font-size: var(--fs-tiny); color: var(--fg-3); }
+.agentchat-earlier-btn {
+  padding: 4px 12px; min-height: 32px; border: var(--bw-hair) solid var(--bg-3);
+  border-radius: var(--r-1); background: var(--bg-2); color: var(--fg-2); cursor: pointer;
+  font-family: var(--ff-body); font-size: var(--fs-tiny);
+}
+.agentchat-earlier-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
+@media (pointer: coarse) {
+  .agentchat-earlier-btn { min-height: 44px; }
+}
+
+/* Inline cwd validation line (checking / error) under the cwd input. */
+.agentchat-cwd-hint { font-size: var(--fs-tiny); color: var(--fg-3); }
+.agentchat-cwd-hint.is-error { color: var(--flame); }
+
+/* Dashboard: shared session title heading (same string as the rails). */
+.ds-dash-title {
+  font-size: var(--fs-body); font-weight: 600; color: var(--fg);
+  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
+}
+
+/* Stopping state: in-flight cancel reads distinctly from running/error. */
+.ds-dash-status.is-stopping { color: var(--amber, #d9a93a); }
+
+/* External (observed, not owned) session card: no stop control exists. */
+.ds-dash-external {
+  padding: 1px 6px; border: var(--bw-hair) solid var(--bg-3); border-radius: var(--r-pill);
+  font-size: var(--fs-micro); color: var(--fg-3); text-transform: uppercase; letter-spacing: .03em;
+}
+.ds-dash-card.is-external { border-style: dashed; }
+
+/* One connection vocabulary: offline (is-lost kept as legacy alias). */
+.ds-dash-stream.is-offline { color: var(--flame); }

package/dist/247420.css

@@ -555,6 +555,9 @@
    ============================================================ */
 .ds-247420 .app {
   display: flex; flex-direction: column;
+  /* Offset parent for the sidebar drawer/scrim/toggle, which are absolute so
+     they overlay THIS shell (a thebird WM window) rather than the viewport. */
+  position: relative;
   min-height: 100vh;
   /* Definite height so the flex column resolves height:100% for descendants
      (e.g. a full-height chat) at every breakpoint, not just where a desktop
@@ -1700,6 +1703,19 @@
 .ds-247420 .ds-upload-item.done .ds-upload-pct { color: var(--success); }
 .ds-247420 .ds-upload-item.error .ds-upload-fill { background: var(--warn); }
 .ds-247420 .ds-upload-item.error .ds-upload-pct { color: var(--warn); }
+/* Per-row upload recovery actions (replace / dismiss) — error rows are not dead ends. */
+.ds-247420 .ds-upload-item { grid-template-columns: minmax(0, 1fr) 120px 44px auto; }
+.ds-247420 .ds-upload-actions { display: inline-flex; gap: var(--space-1); justify-content: flex-end; }
+.ds-247420 .ds-upload-act {
+  padding: 2px 10px; min-height: 24px; cursor: pointer;
+  background: var(--bg); border: var(--bw-hair) solid var(--rule); border-radius: var(--r-1);
+  color: var(--fg-2); font-family: var(--ff-body); font-size: var(--fs-micro);
+}
+.ds-247420 .ds-upload-act:hover { background: var(--bg-3); color: var(--fg); }
+.ds-247420 .ds-upload-act:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
+@media (hover: none), (pointer: coarse) {
+  .ds-247420 .ds-upload-act { min-height: 44px; min-width: 44px; }
+}
 
 /* Empty state */
 .ds-247420 .ds-file-empty {
@@ -1757,6 +1773,14 @@
   font-family: inherit; font-size: var(--fs-sm);
 }
 .ds-247420 .ds-modal-input:focus { outline: 2px solid var(--accent); outline-offset: 2px; }
+/* In-body modal error (role=alert): mutation failures (409/403) surface INSIDE
+   the dialog, not behind the fixed overlay. */
+.ds-247420 .ds-modal-error {
+  margin: var(--space-2) 0 0; padding: 8px 10px;
+  border: var(--bw-hair) solid var(--flame); border-radius: var(--r-2);
+  background: color-mix(in oklab, var(--flame) 12%, var(--bg));
+  color: var(--flame); font-size: var(--fs-xs);
+}
 .ds-247420 .btn-primary.danger {
   background: var(--warn);
   border-color: var(--warn);
@@ -1886,10 +1910,12 @@
 .ds-247420 .ds-file-row:hover .ds-file-check,
 .ds-247420 .ds-file-row:focus-within .ds-file-check,
 .ds-247420 .ds-file-check.on { opacity: 1; }
-/* Touch / coarse-pointer devices have no hover — keep checkboxes visible so
-   multi-select is reachable without a pointer. */
+/* Touch / coarse-pointer devices have no hover — keep checkboxes AND the
+   per-row action buttons (rename/delete/download) visible so the file manager
+   is fully reachable without a pointer (e.g. an iPad in landscape). */
 @media (hover: none), (pointer: coarse) {
   .ds-247420 .ds-file-check { opacity: 1; }
+  .ds-247420 .ds-file-actions { opacity: 1; }
 }
 .ds-247420 .ds-file-check.on { background: var(--accent); border-color: var(--accent); }
 .ds-247420 .ds-file-row.selected {
@@ -3031,14 +3057,20 @@
    ============================================================ */
 
 /* Tablet + Mobile: side rail becomes off-canvas drawer (≤900px) */
-@media (max-width: 900px) {
+/* Sidebar drawer collapse keys on the SHELL width (@container on .app, which is
+   container-type:inline-size) — NOT the viewport. Full-page (freddie) the shell
+   == viewport so this is identical to the old @media(max-width:900px); embedded
+   in a thebird WM window the drawer + hamburger appear when the WINDOW is narrow
+   even on a wide desktop. Drawer/scrim/toggle are absolute (anchored to .app), so
+   they overlay the window, not the page. */
+@container (max-width: 900px) {
   .ds-247420 .app-body,
   .ds-247420 .app-body.no-side { grid-template-columns: 1fr !important; }
   .ds-247420 .app-side-shell {
-    position: fixed;
+    position: absolute;
     left: 0; top: var(--app-topbar-h);
-    height: calc(100vh - var(--app-topbar-h) - var(--app-status-h));
-    width: 280px; max-width: 80vw;
+    height: calc(100% - var(--app-topbar-h) - var(--app-status-h));
+    width: 280px; max-width: 80%;
     transform: translateX(-100%);
     transition: transform var(--dur-base, 240ms) var(--ease, ease);
     z-index: 50;
@@ -3072,21 +3104,24 @@
   .ds-247420 .app-main { padding-left: var(--space-3); padding-right: var(--space-3); }
 }
 
-/* Drawer scrim — lives inside .app-body, shown when drawer open ≤900px */
+/* Drawer scrim — absolute so it covers THIS shell, shown when drawer open and
+   the shell is narrow (@container on .app). */
 .ds-247420 .app-side-scrim {
   display: none;
-  position: fixed; inset: 0;
+  position: absolute; inset: 0;
   background: color-mix(in oklab, var(--bg) 60%, transparent);
   z-index: 49;
 }
-@media (max-width: 900px) {
+@container (max-width: 900px) {
   .ds-247420 .app-body.side-open .app-side-scrim { display: block; }
 }
 
-/* Mobile nav toggle (hamburger) — hidden on desktop, shown ≤900px */
+/* Nav toggle (hamburger) — hidden when the shell is wide, shown when the shell
+   itself is narrow (@container on .app). Absolute so it sits in THIS shell's
+   topbar, not pinned to the viewport corner. */
 .ds-247420 .app-side-toggle {
   display: none;
-  position: fixed; top: calc((var(--app-topbar-h) - 44px) / 2); left: 10px;
+  position: absolute; top: calc((var(--app-topbar-h) - 44px) / 2); left: 10px;
   z-index: 51;
   /* 44x44 minimum hit area (WCAG 2.5.5 / Apple HIG) - 36px is below the
      reliable-tap threshold on touch. */
@@ -3099,7 +3134,7 @@
   cursor: pointer;
 }
 .ds-247420 .app-side-toggle:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
-@media (max-width: 900px) {
+@container (max-width: 900px) {
   .ds-247420 .app-side-toggle { display: inline-flex; }
   .ds-247420 .app-topbar .brand { margin-left: 44px; }
 }
@@ -5415,6 +5450,97 @@
   .ds-247420 .ds-session-meta-copy { min-height: 44px; min-width: 44px; }
 }
 
+/* ============================================================================
+   Logic/predictability sweep (2026-06-10): composer ergonomics, turn notices,
+   windowed thread, dashboard stopping/external states, cwd validation.
+============================================================================ */
+
+/* Enter-to-send hint: visible while the composer is focused or carries a
+   draft; hidden under 420px to save rows. */
+.ds-247420 .chat-composer-hint {
+  display: none; padding: 2px var(--space-3) 0;
+  font-size: var(--fs-micro); color: var(--fg-3);
+}
+.ds-247420 .chat-composer:focus-within .chat-composer-hint,
+.ds-247420 .chat-composer.has-draft .chat-composer-hint { display: block; }
+@media (max-width: 420px) {
+  .ds-247420 .chat-composer .chat-composer-hint { display: none; }
+}
+
+/* Transient composer note (paste/drop not supported), aria-live polite. */
+.ds-247420 .chat-composer-note {
+  padding: 4px var(--space-3); font-size: var(--fs-tiny); color: var(--fg-2);
+}
+
+/* Drag-over ring: token accent, never a hex. */
+.ds-247420 .chat-composer.dragover { outline: 2px solid var(--accent); outline-offset: -2px; border-radius: var(--r-2); }
+
+/* Per-bit composer context: only the bit that owns a control is a button. */
+.ds-247420 .chat-composer-context-bit {
+  display: inline; padding: 0; margin: 0;
+  background: none; border: none; cursor: pointer;
+  font: inherit; color: inherit; text-decoration: underline dotted;
+}
+.ds-247420 .chat-composer-context-bit:hover { color: var(--fg-2); }
+.ds-247420 .chat-composer-context-bit:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
+@media (pointer: coarse) {
+  .ds-247420 .chat-composer-context-bit { min-height: 44px; }
+}
+
+/* Out-of-band turn notices: neutral tone (NOT error red) — a stopped or
+   incomplete turn must not read as a finished answer. */
+.ds-247420 .chat-msg-notice {
+  margin-top: var(--space-1); padding: 6px 10px;
+  border: var(--bw-hair) solid var(--rule); border-radius: var(--r-2);
+  background: var(--bg-2); color: var(--fg-2); font-size: var(--fs-tiny);
+}
+.ds-247420 .chat-msg-notice.is-incomplete { border-style: dashed; }
+
+/* Tail-window streaming head ('streaming · N KB so far'). */
+.ds-247420 .chat-stream-head {
+  padding: 2px 0 6px; font-family: var(--ff-mono);
+  font-size: var(--fs-micro); color: var(--fg-3);
+}
+
+/* Windowed thread: 'show N earlier turns' control at the top. */
+.ds-247420 .agentchat-earlier {
+  display: flex; align-items: center; justify-content: center;
+  gap: var(--space-3); padding: var(--space-2) var(--space-3);
+}
+.ds-247420 .agentchat-earlier-count { font-size: var(--fs-tiny); color: var(--fg-3); }
+.ds-247420 .agentchat-earlier-btn {
+  padding: 4px 12px; min-height: 32px; border: var(--bw-hair) solid var(--bg-3);
+  border-radius: var(--r-1); background: var(--bg-2); color: var(--fg-2); cursor: pointer;
+  font-family: var(--ff-body); font-size: var(--fs-tiny);
+}
+.ds-247420 .agentchat-earlier-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
+@media (pointer: coarse) {
+  .ds-247420 .agentchat-earlier-btn { min-height: 44px; }
+}
+
+/* Inline cwd validation line (checking / error) under the cwd input. */
+.ds-247420 .agentchat-cwd-hint { font-size: var(--fs-tiny); color: var(--fg-3); }
+.ds-247420 .agentchat-cwd-hint.is-error { color: var(--flame); }
+
+/* Dashboard: shared session title heading (same string as the rails). */
+.ds-247420 .ds-dash-title {
+  font-size: var(--fs-body); font-weight: 600; color: var(--fg);
+  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
+}
+
+/* Stopping state: in-flight cancel reads distinctly from running/error. */
+.ds-247420 .ds-dash-status.is-stopping { color: var(--amber, #d9a93a); }
+
+/* External (observed, not owned) session card: no stop control exists. */
+.ds-247420 .ds-dash-external {
+  padding: 1px 6px; border: var(--bw-hair) solid var(--bg-3); border-radius: var(--r-pill);
+  font-size: var(--fs-micro); color: var(--fg-3); text-transform: uppercase; letter-spacing: .03em;
+}
+.ds-247420 .ds-dash-card.is-external { border-style: dashed; }
+
+/* One connection vocabulary: offline (is-lost kept as legacy alias). */
+.ds-247420 .ds-dash-stream.is-offline { color: var(--flame); }
+
 /* editor-primitives.css */
 /* editor-primitives.css — chrome for in-engine editors, inspectors, IDEs,
    debug HUDs. All rules under .ds-247420 scope (build prefixes). Tokens