@justai/cuts 0.152.0 → 0.153.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@justai/cuts",
-  "version": "0.152.0",
+  "version": "0.153.0",
   "description": "A persona's named parts — the page shell that holds them, and the cuts themselves.",
   "license": "UNLICENSED",
   "repository": {
@@ -41,8 +41,8 @@
     "access": "public"
   },
   "dependencies": {
-    "@justai/core": "^0.41.0",
-    "@justai/ui": "^0.28.0",
+    "@justai/core": "^0.42.0",
+    "@justai/ui": "^0.29.0",
     "@justai/atrium": "^0.1.9"
   },
   "scripts": {

package/src/ChildPersona.astro

@@ -236,15 +236,22 @@ const chrome = face === "page";
     display: flex; flex-direction: column;
     padding-inline: max(var(--gutter, 16px), env(safe-area-inset-left)) max(var(--gutter, 16px), env(safe-area-inset-right));
   }
-  /* 640 is the fleet's one threshold and the fleet's one column width — @justai/ui declares
-     `--column`, and a media query cannot read a custom property, so the NUMBER has to be written
-     again here. Written again is not decided again: if this ever disagrees with base.css, this is
-     the copy that is wrong. */
+  /* 1280 is the fleet's one threshold and the fleet's one column width (2026-10-14; 640 before) —
+     @justai/ui declares `--column`, and a media query cannot read a custom property, so the NUMBER has
+     to be written again here. Written again is not decided again: if this ever disagrees with
+     base.css, this is the copy that is wrong. The gutter steps at 640 and keeps the safe-area term
+     until the column, exactly as base.css does. */
   @media (min-width: 640px) {
     .pp .app {
       --gutter: 28px;
-      max-width: 640px;
-      max-width: var(--column, 640px);
+      padding-left: 28px; padding-right: 28px;
+      padding-inline: max(var(--gutter, 28px), env(safe-area-inset-left)) max(var(--gutter, 28px), env(safe-area-inset-right));
+    }
+  }
+  @media (min-width: 1280px) {
+    .pp .app {
+      max-width: 1280px;
+      max-width: var(--column, 1280px);
       margin-left: auto; margin-right: auto; margin-inline: auto;
       padding-left: 28px; padding-right: 28px; padding-inline: var(--gutter, 28px);
       border-left: 1px solid var(--border); border-right: 1px solid var(--border);

package/src/Profile.astro

@@ -29,8 +29,9 @@
 // href stay local with no per-consumer escape hatch. `files`, `me` and `feed` each hand-rolled this
 // entire section before; they are child personas, and a child persona is a persona.
 //
-// CONTRACT: the shell's scroll-spy reads `.pname` and `.handle` from here to name the title strip, and
-// the section id `#profile` is one of the three cut anchors. Nothing else depends on the profile.
+// CONTRACT: the section id `#profile` is one of the three cut anchors. Nothing else depends on the
+// profile. (The scroll-spy also read `.pname` and `.handle` from here to name the toolbar's title strip;
+// the strip went in cuts 0.152.0 and nothing reads them now.)
 interface Props {
   // The persona name (the <h1>), rendered RAW — it is authored in the persona's own source, never user
   // input, so a name may carry markup (justai's "justai<span class='pro'>.pro</span>"). Same rule as the
@@ -108,7 +109,9 @@ const vars = [
     background: var(--cover, linear-gradient(135deg, var(--accent), transparent));
     position: relative;
   }
-  @media (min-width: 640px) { .cover { margin-inline: -28px; } }
+  /* the cover mirrors the page's padding: 28 with the safe-area term from 640, plain 28 at the column (1280) */
+  @media (min-width: 640px) { .cover { margin-inline: calc(-1 * max(28px, env(safe-area-inset-left))) calc(-1 * max(28px, env(safe-area-inset-right))); } }
+  @media (min-width: 1280px) { .cover { margin-inline: -28px; } }
   .avatar {
     width: 76px; height: 76px; border-radius: var(--radius-lg); margin-block-start: -40px;
     display: grid; place-items: center; padding: var(--avatar-pad, 0);

package/src/Sheet.astro

@@ -318,16 +318,13 @@ const doneIsOurs = doneDefault || done === true;
     position: relative;   /* the Done action is positioned against this */
     display: flex;
     flex-direction: column;
-    /* THE ONE SIZING RULE, and there is no media query anywhere in this file. The persona's column
-       is the active view, and its width is READ rather than repeated: `--column` is declared once in
-       @justai/ui and the page is sized from the same token. On a phone this is the whole screen; on a
-       desk it is the persona's own width, centred. It said 480 until 2026-08-04, in its own copy of
-       the number — so when the page became 768 the sheet stayed a phone's width on a tablet. */
-    /* THE FALLBACK IS NOT DECORATION. `--column` arrives with @justai/ui, and a page that uses this
-       cut without it — the harness's own sheet fixture is one — never sees the token at all. So the
-       literal here is the fleet's real width, not a historical one: it was 768 for an afternoon and
-       the sheet quietly rendered at 768 on a 640 fleet, which is how that was found. */
-    width: min(100%, var(--sheet-width, var(--column, 640px)));
+    /* THE ONE SIZING RULE, and there is no media query anywhere in this file: the whole screen on a
+       phone, 640 centred anywhere wider. Until 2026-10-14 the sheet READ the column (`--column`), and
+       the column was 640. When the column became 1280 the sheet stopped following it: a sheet across a
+       desk-wide column is a page, not a sheet — 640 is the width the fleet already knows a sheet at,
+       and a persona that wants another sets `--sheet-width`. (History: 480 until 2026-08-04 in its own
+       copy, then the column's 768 for an afternoon, then 640.) */
+    width: min(100%, var(--sheet-width, 640px));
     /* dvh is Chromium 108+; the fallback above it survives because the build has targets. */
     max-height: min(92vh, 100vh - 24px);
     max-height: min(92dvh, 100dvh - 24px);

package/src/Toolbar.astro

@@ -351,7 +351,11 @@ import AuthMount from "./AuthMount.astro";
   /* `.stuck` is still set by the script below and still means "content is under the bar" — it simply
      has nothing to paint now that the shelf is opaque and always shadowed. Kept because the class is
      part of this cut's contract and a consumer may hang its own behaviour on it. */
-  @media (min-width: 640px) { .toolbar { margin-inline: -28px; padding-inline: 28px; } }
+  /* From 640 the gutter is 28, and the app still fills the screen until 1280 — an iPhone held sideways is
+     in that range, so the bar keeps the safe-area term exactly as the page's padding does. At the
+     column (1280, @justai/ui base.css) the page drops it and so does the bar. */
+  @media (min-width: 640px) { .toolbar { margin-inline: calc(-1 * max(28px, env(safe-area-inset-left))) calc(-1 * max(28px, env(safe-area-inset-right))); padding-inline: max(28px, env(safe-area-inset-left)) max(28px, env(safe-area-inset-right)); } }
+  @media (min-width: 1280px) { .toolbar { margin-inline: -28px; padding-inline: 28px; } }
   .tb-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
   /* nav lives on the left, beside the back affordance — the middle is intentionally empty */
   .tb-left { display: flex; align-items: center; gap: 2px; min-width: 0; }