@crewlethq/ui 0.63.0 → 0.64.1

package/dist/{SetupWizard-Z54H6RYW.css → SetupWizard-WDOFFNIM.css}

@@ -178,6 +178,16 @@
   margin-inline-start: auto;
 }
 
+/*
+ * A GHOST AT THE ROW'S START is pulled out by its padding and edge, as a card
+ * foot's is (StatusCard.css), so "Exit" starts on the line the title and the
+ * hairline above it start on rather than 13px inside it; only the hover's
+ * ground reaches past. The footer's buttons are the page's own step, medium.
+ */
+.crewlet-setup-wizard__footer-start > .crewlet-btn--ghost.crewlet-btn--medium:first-child {
+  margin-inline-start: calc(-1 * (var(--spacing-3) + 1px));
+}
+
 /*
  * BESIDE THE CONTENT, from 70rem of the wizard's own width: the aside holds in
  * view. Written at the specificity of the wide and no-aside rules above, and
@@ -250,9 +260,17 @@
     gap: var(--spacing-2);
   }
 
+  /*
+   * THE FOLDED PREVIEW HANGS IN THE GUTTER, as a change list's disclosure
+   * does: the trigger's padding and the panel's inset stand outside the
+   * column, so the chevron sits on the edge the fields above start on and the
+   * open preview is as wide as they are, rather than 8px inside it at both
+   * ends.
+   */
   .crewlet-setup-wizard__preview {
     grid-area: aside;
     min-width: 0;
+    margin-inline: calc(var(--spacing-2) * -1);
   }
 
   .crewlet-setup-wizard__preview .crewlet-setup-wizard__aside {
@@ -279,6 +297,13 @@
   .crewlet-setup-wizard__footer-end > :last-child {
     flex: 1 1 100%;
   }
+
+  /* The first row's last action ends it, at the row's end: a ghost there is
+     pulled out as "Exit" is at its start, so the two words stand level with
+     the primary's edges under them. */
+  .crewlet-setup-wizard__footer-end > .crewlet-btn--ghost.crewlet-btn--medium:nth-last-child(2) {
+    margin-inline-end: calc(-1 * (var(--spacing-3) + 1px));
+  }
 }
 
 .crewlet-setup-wizard__position {

package/dist/ShareDialog/index.js

@@ -1,13 +1,13 @@
-export { ARTIFACT_ROLES, SHAREABLE_ROLES, ShareDialog, roleAtLeast } from '../chunk-B5ZHJWAZ.js';
-import '../chunk-XQZ6EWOE.js';
-import '../chunk-IOTN23FZ.js';
+export { ARTIFACT_ROLES, SHAREABLE_ROLES, ShareDialog, roleAtLeast } from '../chunk-WWXIGN4O.js';
+import '../chunk-VK45YJLH.js';
+import '../chunk-IYG4ETAQ.js';
 import '../chunk-STJ7QBC3.js';
 import '../chunk-DTIW4CHZ.js';
-import '../chunk-KVWZDCTQ.js';
+import '../chunk-I24FI46B.js';
 import '../chunk-7KHM2FZH.js';
 import '../chunk-BPCY7ZID.js';
 import '../chunk-CI3VPIJN.js';
-import '../chunk-5AQBPHZD.js';
+import '../chunk-BKP6XCAJ.js';
 import '../chunk-PZKHBB7D.js';
 import '../chunk-PQADV6P6.js';
 import '../chunk-RTPQDNW3.js';
@@ -16,7 +16,7 @@ import '../chunk-OMV5W53A.js';
 import '../chunk-2YTOOH3A.js';
 import '../chunk-XSPCITPN.js';
 import '../chunk-H5XTJ7GJ.js';
-import '../chunk-2XWFWNDT.js';
+import '../chunk-UAUP6XGK.js';
 import '../chunk-NUZHC6MM.js';
 import '../chunk-UT6CW3C7.js';
 import '../chunk-ODEQTPFM.js';

package/dist/{ShareDialog-4QDCBWMH.css → ShareDialog-72VTMM4K.css}

@@ -140,10 +140,14 @@
 }
 
 /* Under the phone breakpoint the row's controls go under the name, so a
-   role select and a remove control never squeeze the name to an ellipsis. */
+   role select and a remove control never squeeze the name to an ellipsis.
+   They are held off the lines above and below them by a gap of their own:
+   with none, a select's edge sat flush on the name's detail line and the
+   agent's note sat flush under the select. */
 @media (width < 640px) {
   .crewlet-share-dialog__row {
     grid-template-columns: auto minmax(0, 1fr);
+    row-gap: var(--spacing-2);
   }
 
   .crewlet-share-dialog__controls {

package/dist/SheetColumnEditor/index.js

@@ -1,29 +1,29 @@
-export { SHEET_COLUMN_EDITOR_LABELS, SheetColumnEditor, SheetColumnTypeGlyph } from '../chunk-OU4FLGOZ.js';
-import '../chunk-XQZ6EWOE.js';
+export { SHEET_COLUMN_EDITOR_LABELS, SheetColumnEditor, SheetColumnTypeGlyph } from '../chunk-SBOUVASH.js';
+import '../chunk-VK45YJLH.js';
 import '../chunk-FFMCMSJB.js';
 import '../chunk-7KHM2FZH.js';
 import '../chunk-LFSIKGRQ.js';
 import '../chunk-Z7JYG5TF.js';
-import '../chunk-QCVAVAF6.js';
+import '../chunk-2EA2GSA2.js';
 import '../chunk-AYKXMIOR.js';
-import '../chunk-F7VBYCW2.js';
-import '../chunk-27JCHL64.js';
+import '../chunk-W6UVBBNH.js';
+import '../chunk-PVZOP3QK.js';
 import '../chunk-EGMQURBR.js';
 import '../chunk-WIATRXEJ.js';
-import '../chunk-KIPAFCVS.js';
-import '../chunk-ACRRRPWT.js';
-import '../chunk-TLIJG4TP.js';
+import '../chunk-PBCNINMB.js';
+import '../chunk-ANTAQAR4.js';
+import '../chunk-ETSF7SU6.js';
 import '../chunk-PGCLHYVP.js';
-import '../chunk-5KRRJNQO.js';
+import '../chunk-MLDTLZAO.js';
 import '../chunk-PQADV6P6.js';
 import '../chunk-2G355KDJ.js';
-import '../chunk-LODRX4FU.js';
+import '../chunk-T73DMDU4.js';
 import '../chunk-7QTPJDRF.js';
 import '../chunk-OMV5W53A.js';
 import '../chunk-2YTOOH3A.js';
 import '../chunk-XSPCITPN.js';
 import '../chunk-H5XTJ7GJ.js';
-import '../chunk-2XWFWNDT.js';
+import '../chunk-UAUP6XGK.js';
 import '../chunk-NUZHC6MM.js';
 import '../chunk-UT6CW3C7.js';
 import '../chunk-ODEQTPFM.js';

package/dist/SheetGrid/index.js

@@ -1,25 +1,25 @@
-export { CellDisplay, CellEditor, CheckboxCell, DateCell, LongTextCell, MultiSelectCell, NumberCell, PersonCell, RatingCell, SelectCell, SheetCell, SheetGrid, StatusCell, TextCell, UrlCell } from '../chunk-VVVB3OBW.js';
-import '../chunk-4U2D6BPR.js';
+export { CellDisplay, CellEditor, CheckboxCell, DateCell, LongTextCell, MultiSelectCell, NumberCell, PersonCell, RatingCell, SelectCell, SheetCell, SheetGrid, StatusCell, TextCell, UrlCell } from '../chunk-OOC6KXNL.js';
+import '../chunk-UEOEBOBR.js';
 import '../chunk-CENOOTAV.js';
-import '../chunk-3BYIWOTV.js';
-import '../chunk-I6POAB4V.js';
-import '../chunk-66X5WDKE.js';
+import '../chunk-MMCYH5LB.js';
+import '../chunk-EFX2YC5T.js';
+import '../chunk-Z2MZTI3H.js';
 import '../chunk-LFSIKGRQ.js';
 import '../chunk-Z7JYG5TF.js';
 import '../chunk-KHJIEPZV.js';
 import '../chunk-AYKXMIOR.js';
-import '../chunk-KYIAFNU7.js';
+import '../chunk-I5OIKDX2.js';
 import '../chunk-I33UIUZD.js';
 import '../chunk-WIATRXEJ.js';
-import '../chunk-5AQBPHZD.js';
+import '../chunk-BKP6XCAJ.js';
 import '../chunk-PZKHBB7D.js';
 import '../chunk-2G355KDJ.js';
-import '../chunk-LODRX4FU.js';
+import '../chunk-T73DMDU4.js';
 import '../chunk-7QTPJDRF.js';
 import '../chunk-OMV5W53A.js';
 import '../chunk-XSPCITPN.js';
 import '../chunk-H5XTJ7GJ.js';
-import '../chunk-2XWFWNDT.js';
+import '../chunk-UAUP6XGK.js';
 import '../chunk-NUZHC6MM.js';
 import '../chunk-UT6CW3C7.js';
 import '../chunk-ODEQTPFM.js';

package/dist/{SheetGrid-XK7T7M34.css → SheetGrid-QGQAYDEY.css}

@@ -126,6 +126,26 @@
   background: var(--color-surface-background);
 }
 
+/*
+ * THE FRAME IS THE SCROLLER'S ONE HAIRLINE ON EVERY SIDE. A cell's trailing
+ * and bottom hairlines are the lines between it and its neighbours, so a cell
+ * with no neighbour laid its line on the scroller's own border: a 2px edge on
+ * the right and at the bottom against 1px at the top and the left, and a
+ * square corner inside the rounded one. The last column leaves its trailing
+ * line to the frame (unless Add column stands after it, which the line keeps
+ * apart), and the last row leaves its bottom line wherever the rows reach the
+ * floor (`__row--floor`, which the component sets). The cell keeps its box,
+ * so its value is centred between the line before it and the frame, as every
+ * other value is between its cell's two lines.
+ */
+.crewlet-sheet-grid__scroller:not(.crewlet-sheet-grid__scroller--add-column) .crewlet-sheet-grid__row > :last-child {
+  border-inline-end-width: 0;
+}
+
+.crewlet-sheet-grid__row--floor > :is(.crewlet-sheet-grid__corner, .crewlet-sheet-grid__header, .crewlet-sheet-grid__rownum, .crewlet-sheet-grid__cell) {
+  border-bottom-width: 0;
+}
+
 .crewlet-sheet-grid__corner,
 .crewlet-sheet-grid__header {
   background: var(--color-surface-subtle);
@@ -326,12 +346,10 @@
 }
 
 /* PENDING (D23): the reader's value, drawn at once, underlined dashed until
-   the engine confirms it. The word is in the cell's description and the strip. */
-.crewlet-sheet-grid__cell--pending > .crewlet-sheet-grid__value {
-  text-decoration: underline dashed var(--color-text-tertiary);
-  text-underline-offset: 3px;
-}
-
+   the engine confirms it. The word is in the cell's description and the strip.
+   ONE RULE, ACROSS THE CELL, for every type: a value of words also took a
+   text underline, so a pending name or number stood over two dashed lines
+   a few pixels apart while a checkbox or a chip had one. */
 .crewlet-sheet-grid__cell--pending > .crewlet-sheet-grid__value::after {
   position: absolute;
   right: var(--spacing-1);
@@ -349,6 +367,26 @@
   color: var(--color-feedback-danger-ink);
 }
 
+/* A REFUSED VALUE KEEPS ITS PLACE. The mark stands at the edge the value does
+   not start from, as the history control does: its auto margin took the
+   slack a number or a rating is pushed to the trailing edge by, and the
+   value jumped to the leading edge on the one cell a reader was asked to
+   look at. A number's and a rating's mark goes first, at the leading edge;
+   a checkbox's stands at the trailing edge out of the flow, so the box stays
+   centred under its header. */
+:is(.crewlet-sheet-grid__cell--number, .crewlet-sheet-grid__cell--rating) > .crewlet-sheet-grid__refused {
+  order: -1;
+  margin-inline: 0 auto;
+  padding-inline: 0 var(--spacing-1);
+}
+
+.crewlet-sheet-grid__cell--checkbox > .crewlet-sheet-grid__refused {
+  position: absolute;
+  inset-inline-end: var(--spacing-2);
+  margin: 0;
+  padding: 0;
+}
+
 .crewlet-sheet-grid__message {
   position: absolute;
   top: 100%;
@@ -479,6 +517,13 @@
   background: var(--color-surface-subtle);
 }
 
+/* On the floor with the header row it stands beside (a sheet with no rows
+   yet), it leaves its hairline to the frame as the headers do: it laid a 2px
+   edge under the control beside the 1px edge under the headers. */
+.crewlet-sheet-grid__add-column--floor {
+  border-bottom-width: 0;
+}
+
 .crewlet-sheet-grid__sync {
   display: inline-flex;
   align-items: center;
@@ -569,12 +614,17 @@
   color: var(--color-text-primary);
 }
 
+/* A field in a form, at the step every field's value takes (an Input's, a
+   Select's, a grid cell's), rather than at whatever size the page's own text
+   is: on a page set at 16px its value stood three pixels larger than the
+   field beside it. */
 .crewlet-sheet-cell {
   position: relative;
   display: inline-flex;
   flex-direction: column;
   gap: var(--spacing-1);
   min-width: 0;
+  font-size: var(--font-size-compact);
 }
 
 .crewlet-sheet-cell__face {
@@ -640,6 +690,36 @@
   font: inherit;
 }
 
+/*
+ * A NUMBER STAYS ON ITS EDGE WHILE IT IS EDITED. A number's and a rating's
+ * value is drawn at the cell's trailing edge in tabular figures, and the field
+ * opened over it set the digits from the leading edge in proportional ones, so
+ * the value jumped 45px across the cell and re-spaced as it opened. The field
+ * takes the column's edge and the value's figures.
+ */
+:is(.crewlet-sheet-grid__cell--number, .crewlet-sheet-grid__cell--rating) .crewlet-sheet-editor__input {
+  font-variant-numeric: tabular-nums;
+  text-align: end;
+}
+
+/*
+ * A LONE CELL'S EDITOR TAKES ITS FACE'S PLACE AT ITS FACE'S SIZE, so nothing
+ * under the cell moves while it is open. The face is a control-step box with
+ * a border all round and its words a hairline and a step in: a line's field
+ * takes its corners and that inset (it was square, with its words a pixel to
+ * the left), and a list's editor keeps its height while the panel lies over
+ * the page (it kept none, and everything under the cell rose by a face). A
+ * text's line is the face's too (see the overlay's field below).
+ */
+.crewlet-sheet-cell .crewlet-sheet-editor__input {
+  padding-inline: calc(var(--spacing-2) + 1px);
+  border-radius: var(--radius-md);
+}
+
+.crewlet-sheet-cell .crewlet-sheet-editor--list {
+  min-height: var(--size-control-md);
+}
+
 .crewlet-sheet-editor__input:focus-visible,
 .crewlet-sheet-editor__filter:focus-visible,
 .crewlet-sheet-editor__textarea:focus-visible {
@@ -685,6 +765,9 @@
    popover's ground and shadow, and a field that wraps and grows to six lines,
    so the start of a value is never scrolled out of view while it is edited. */
 .crewlet-sheet-editor__overlay {
+  /* Where its words start, the field's and the notes' under it: a step in
+     from the edge of the cell it lies over, its own border taken out. */
+  --crewlet-sheet-editor-inset: calc(var(--spacing-2) - 1px);
   position: absolute;
   top: 0;
   inset-inline-start: 0;
@@ -709,10 +792,13 @@
 
 .crewlet-sheet-editor__overlay > .crewlet-sheet-editor__error,
 .crewlet-sheet-editor__overlay > .crewlet-sheet-editor__conflict {
-  margin: 0 var(--spacing-2) var(--spacing-2);
+  margin: 0 var(--crewlet-sheet-editor-inset) var(--spacing-2);
 }
 
+/* A lone cell's face has a border all round, so the words stand a hairline
+   and a step in, where the face's stood. */
 .crewlet-sheet-cell .crewlet-sheet-editor__overlay {
+  --crewlet-sheet-editor-inset: var(--spacing-2);
   position: relative;
   width: 100%;
   max-width: none;
@@ -730,11 +816,23 @@
   font: inherit;
 }
 
+/*
+ * THE VALUE DOES NOT MOVE WHEN ITS CELL OPENS. One line of the field is the
+ * row it lies over less the overlay's two hairlines, and the line is centred
+ * where the cell centres its value (on the row less the hairline under it),
+ * with the overlay's border taken out of the inline step, so the words start
+ * where the cell's did. Padded a step on every side, a value stood 3.5px
+ * lower and 1px further in than in the cell it replaced, and one line of it
+ * was 38px tall over a 32px row. A longer value grows down from that line.
+ */
 .crewlet-sheet-editor__overlay .crewlet-sheet-editor__textarea {
+  --crewlet-sheet-editor-row: var(--crewlet-sheet-row-height, var(--size-sheet-row));
+  --crewlet-sheet-editor-line: calc(var(--font-line-height-normal) * 1em);
+  --crewlet-sheet-editor-pad: calc((var(--crewlet-sheet-editor-row) - var(--crewlet-sheet-editor-line)) / 2 - 1px);
   display: block;
-  min-height: var(--crewlet-sheet-row-height, var(--size-sheet-row));
-  max-height: calc(var(--crewlet-sheet-editor-lines, 6) * var(--font-line-height-normal) * 1em + 2 * var(--spacing-2));
-  padding: var(--spacing-2);
+  min-height: calc(var(--crewlet-sheet-editor-line) + 2 * var(--crewlet-sheet-editor-pad));
+  max-height: calc(var(--crewlet-sheet-editor-lines, 6) * var(--crewlet-sheet-editor-line) + 2 * var(--crewlet-sheet-editor-pad));
+  padding: calc(var(--crewlet-sheet-editor-pad) - 0.5px) var(--crewlet-sheet-editor-inset) calc(var(--crewlet-sheet-editor-pad) + 0.5px);
   overflow-y: auto;
   border: 0;
   border-radius: var(--radius-md);
@@ -745,6 +843,13 @@
   resize: none;
 }
 
+/* A lone cell's field has the face's line (the control step), centred in it
+   as the face centres its value between its two borders. */
+.crewlet-sheet-cell .crewlet-sheet-editor__overlay .crewlet-sheet-editor__textarea {
+  --crewlet-sheet-editor-row: var(--size-control-md);
+  padding: var(--crewlet-sheet-editor-pad) var(--crewlet-sheet-editor-inset);
+}
+
 .crewlet-sheet-editor__list {
   display: flex;
   flex-direction: column;
@@ -809,6 +914,13 @@
   border-top: 1px solid var(--color-border-default);
 }
 
+/* The rule divides the note from what stands above it; first in its panel
+   (a line editor's, with no error over it), it divided it from nothing. */
+.crewlet-sheet-editor__conflict:first-child {
+  padding-top: 0;
+  border-top: 0;
+}
+
 .crewlet-sheet-editor__conflict-text {
   margin: 0;
   color: var(--color-text-secondary);
@@ -836,6 +948,16 @@
     border-radius: var(--radius-lg) var(--radius-lg) 0 0;
   }
 
+  /* A sheet of its own rather than a field over a cell, so it has no cell's
+     line to keep and is padded a step all round, its notes with it. */
+  .crewlet-sheet-grid .crewlet-sheet-editor--long .crewlet-sheet-editor__overlay {
+    --crewlet-sheet-editor-inset: var(--spacing-2);
+  }
+
+  .crewlet-sheet-grid .crewlet-sheet-editor--long .crewlet-sheet-editor__textarea {
+    --crewlet-sheet-editor-pad: var(--spacing-2);
+    padding: var(--crewlet-sheet-editor-pad) var(--crewlet-sheet-editor-inset);
+  }
 }
 
 @media (forced-colors: active) {

package/dist/SidePanel/index.js

@@ -1,11 +1,11 @@
 import '../chunk-73GUXYYE.js';
-export { SIDE_PANEL_LABELS, SIDE_PANEL_MAX_WIDTH, SIDE_PANEL_MIN_WIDTH, SIDE_PANEL_WIDTH, SidePanel, SidePanelFrame } from '../chunk-PUJUWLCX.js';
+export { SIDE_PANEL_LABELS, SIDE_PANEL_MAX_WIDTH, SIDE_PANEL_MIN_WIDTH, SIDE_PANEL_WIDTH, SidePanel, SidePanelFrame } from '../chunk-CLJGFOTV.js';
 import '../chunk-PQADV6P6.js';
 import '../chunk-PIYJNCN7.js';
 import '../chunk-OMV5W53A.js';
 import '../chunk-2YTOOH3A.js';
 import '../chunk-H5XTJ7GJ.js';
-import '../chunk-2XWFWNDT.js';
+import '../chunk-UAUP6XGK.js';
 import '../chunk-NUZHC6MM.js';
 import '../chunk-UT6CW3C7.js';
 import '../chunk-ODEQTPFM.js';

package/dist/SidebarNav/index.js

@@ -1,6 +1,6 @@
-export { NavGroup, NavItem, SidebarNav } from '../chunk-B53FUJ53.js';
+export { NavGroup, NavItem, SidebarNav } from '../chunk-WCDPFTJZ.js';
 import '../chunk-TEV5REGB.js';
-import '../chunk-FYTIJM2T.js';
+import '../chunk-HBDA76EZ.js';
 import '../chunk-2YTOOH3A.js';
 import '../chunk-UT6CW3C7.js';
 import '../chunk-ODEQTPFM.js';

package/dist/{SidebarNav-YI74SPDC.css → SidebarNav-VTQ3G4AE.css}

@@ -48,9 +48,12 @@
  * does not depend on the document's box-sizing: with the rail's own gap it is
  * 14px, the design's space between two runs, at density 1.
  *
- * Its end inset is a step SHORTER than a row's, because the control is a
- * 24px square with its glyph centred in it: the row pad would put the glyph
- * five pixels inside the line every count above and below it ends on.
+ * Its end inset is SHORTER than a row's by the part of the control the glyph
+ * leaves empty, because the control is a 24px square with a nav glyph (`sm`,
+ * 14px) centred in it: the row pad would put the glyph five pixels inside the
+ * line every count above and below it ends on. A plain step shorter left it a
+ * pixel inside at the normal density and nearly two at the compact one, where
+ * the pad shrinks and the square does not.
  */
 .crewlet-nav-group__head {
   display: flex;
@@ -59,7 +62,7 @@
   min-width: 0;
   min-height: var(--size-target-min);
   margin-top: calc(var(--spacing-2) + var(--spacing-1) / 2);
-  padding: 0 var(--spacing-2) 0 var(--size-nav-row-pad);
+  padding: 0 calc(var(--size-nav-row-pad) - (var(--size-target-min) - 14px) / 2) 0 var(--size-nav-row-pad);
 }
 
 /*
@@ -401,6 +404,13 @@
  * path the reader is on the guide steps up to the strong border: the same
  * neutral lift the current row itself takes, and not the accent, which the
  * rail keeps for the one count that asks the reader to act.
+ *
+ * A NESTED ROW'S WORDS START ON ITS PARENT'S WORDS. The guide stands on the
+ * glyph column's start, and the inset after it is a nav glyph (`sm`, 14px)
+ * and the row's gap to its word, less the guide's own pixel and the pad the
+ * nested row takes again. A plain step there stood every nested word 3px
+ * left of its parent's (5px at the compact density), a column that read as
+ * missed rather than indented.
  */
 .crewlet-nav-item__children {
   --crewlet-nav-children-gap: var(--spacing-1);
@@ -409,7 +419,7 @@
   flex-direction: column;
   gap: var(--crewlet-nav-children-gap);
   margin-left: var(--size-nav-row-pad);
-  padding-left: var(--spacing-2);
+  padding-left: calc(14px + var(--spacing-2) + var(--spacing-1) / 2 - var(--size-nav-row-pad) - 1px);
   border-left: 1px solid var(--color-border-default);
 }
 

package/dist/Skeleton/index.js

@@ -1,3 +1,3 @@
-export { Skeleton } from '../chunk-QBI5ETKY.js';
+export { Skeleton } from '../chunk-BRLZXYPA.js';
 import '../chunk-UT6CW3C7.js';
 import '../chunk-ODEQTPFM.js';

package/dist/{Skeleton-V735HRGM.css → Skeleton-7ZA5ETJM.css}

@@ -106,11 +106,18 @@
 }
 
 /* ── card / grid / list containers ──────────────────────────────── */
-.crewlet-skeleton--card {
+/*
+ * THE CARD'S OWN INSET, Card's default `md` step, so the lines start where
+ * the card's words will and nothing moves sideways when it arrives. The
+ * placeholder card was 24px in and a grid's 20px, two insets for one card and
+ * neither of them the 16px a Card draws at by default.
+ */
+.crewlet-skeleton--card,
+.crewlet-skeleton__card {
   background: var(--color-surface-subtle);
   border: 1px solid var(--color-border-default);
   border-radius: var(--radius-lg);
-  padding: var(--spacing-6);
+  padding: var(--spacing-4);
 }
 
 /*
@@ -130,13 +137,6 @@
   width: 100%;
 }
 
-.crewlet-skeleton__card {
-  background: var(--color-surface-subtle);
-  border: 1px solid var(--color-border-default);
-  border-radius: var(--radius-lg);
-  padding: var(--spacing-5);
-}
-
 .crewlet-skeleton--list {
   display: flex;
   flex-direction: column;
@@ -182,8 +182,17 @@
 .crewlet-skeleton__table tbody { display: table-row-group; }
 .crewlet-skeleton__table tr { display: table-row; }
 
+/*
+ * THE REAL TABLE'S ROWS (Table.css, DataTable.css), so nothing jumps when the
+ * table arrives: every cell at its 8px over 12px inset, the header one
+ * micro-label line tall at the document's leading, and a body row at the row
+ * token. The header's block used to stand on a line of text nudged up 4px,
+ * which left it 1px under the row's top and 13px over its rule, and a body
+ * row stood 33px tall, 3px short of the row token.
+ */
 .crewlet-skeleton__th {
-  padding: 2px var(--spacing-4);
+  height: calc(var(--spacing-2) * 2 + var(--font-size-2xs) * var(--font-line-height-body));
+  padding: var(--spacing-2) var(--spacing-3);
   text-align: left;
   position: relative;
   display: table-cell;
@@ -195,8 +204,6 @@
   height: 14px;
   width: 60%;
   margin: 0;
-  display: inline-block;
-  transform: translateY(-4px);
 }
 
 .crewlet-skeleton__th:first-child .crewlet-skeleton__line { width: 70%; }
@@ -209,7 +216,8 @@
 }
 
 .crewlet-skeleton__td {
-  padding: var(--spacing-3) var(--spacing-4);
+  height: var(--size-row-md);
+  padding: var(--spacing-2) var(--spacing-3);
   display: table-cell;
   text-align: left;
   vertical-align: middle;
@@ -387,9 +395,6 @@
 
   .crewlet-skeleton__info-item::before { display: none; }
   .crewlet-skeleton__info-item:where(:nth-child(n + 2))::before { display: block; }
-
-  .crewlet-skeleton--card,
-  .crewlet-skeleton__card { padding: var(--spacing-4); }
 }
 
 /*

package/dist/SlideCompare/index.js

@@ -1,4 +1,4 @@
-export { SLIDE_COMPARE_LABELS, SlideCompare } from '../chunk-W2Q5DZJB.js';
+export { SLIDE_COMPARE_LABELS, SlideCompare } from '../chunk-2SU735S3.js';
 import '../chunk-RMEBFYL7.js';
 import '../chunk-7QTPJDRF.js';
 import '../chunk-OMV5W53A.js';

package/dist/{SlideCompare-HTCMPQFY.css → SlideCompare-R4GVZXAM.css}

@@ -86,13 +86,16 @@
   align-self: flex-start;
 }
 
+/* The dashed edge is an OUTLINE, as a framed slide's edge is, so the empty
+   side's edge lines up with the slide beside it and the slides above and below
+   it: as a border it was drawn inside the box, one pixel in on every side. */
 .crewlet-slide-compare__missing {
   display: flex;
   align-items: center;
   justify-content: center;
   aspect-ratio: 16 / 9;
   margin: 0;
-  border: 1px dashed var(--color-border-strong);
+  outline: 1px dashed var(--color-border-strong);
   border-radius: var(--radius-sm);
   color: var(--color-text-tertiary);
   font-size: var(--font-size-sm);

package/dist/SlideFilmstrip/index.js

@@ -1,14 +1,14 @@
-export { SlideFilmstrip } from '../chunk-XLJPLCK6.js';
+export { SlideFilmstrip } from '../chunk-U7J52N67.js';
 import '../chunk-RMEBFYL7.js';
 import '../chunk-MPVMB2DV.js';
-import '../chunk-ACRRRPWT.js';
+import '../chunk-ANTAQAR4.js';
 import '../chunk-2G355KDJ.js';
-import '../chunk-LODRX4FU.js';
+import '../chunk-T73DMDU4.js';
 import '../chunk-7QTPJDRF.js';
 import '../chunk-OMV5W53A.js';
 import '../chunk-XSPCITPN.js';
 import '../chunk-H5XTJ7GJ.js';
-import '../chunk-2XWFWNDT.js';
+import '../chunk-UAUP6XGK.js';
 import '../chunk-NUZHC6MM.js';
 import '../chunk-UT6CW3C7.js';
 import '../chunk-ODEQTPFM.js';

package/dist/{SlideFilmstrip-PAT7P4OG.css → SlideFilmstrip-BLGBCLEU.css}

@@ -102,15 +102,21 @@
   color: var(--color-text-secondary);
 }
 
-/* A CONTROL'S CORNER: the handle is a 24px control like any toolbar button,
+/* A CONTROL'S CORNER: the handle is a small control like any toolbar button,
    so it takes --radius-md; the thumbnail beside it is a slide, and keeps the
-   slide's own smaller corner. */
+   slide's own smaller corner.
+
+   AND THE SMALL CONTROL'S SIZE, square in both orientations: the small step,
+   which floors itself at the pointer target, with the glyph that step draws.
+   It was the 24px target floor with a 14px glyph, so the actions menu under
+   it (a small IconButton, 26px with a 12px glyph) was a larger square in the
+   same column, and in a row the handle was 24 by 26. */
 .crewlet-slide-filmstrip__handle {
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  min-width: var(--size-target-min);
-  min-height: var(--size-target-min);
+  min-width: var(--size-control-sm);
+  min-height: var(--size-control-sm);
   padding: 0;
   border: 0;
   border-radius: var(--radius-md);
@@ -119,6 +125,11 @@
   cursor: grab;
 }
 
+.crewlet-slide-filmstrip__handle .crewlet-glyph {
+  width: var(--font-size-xs);
+  height: var(--font-size-xs);
+}
+
 .crewlet-slide-filmstrip__handle:hover {
   background: var(--color-surface-hover);
 }
@@ -175,7 +186,6 @@
 
 .crewlet-slide-filmstrip--horizontal .crewlet-slide-filmstrip__handle {
   grid-area: handle;
-  min-height: var(--size-control-sm);
   cursor: grab;
 }
 

package/dist/SlideGrid/index.js

@@ -1,4 +1,4 @@
-export { SlideGrid } from '../chunk-3V5T5K5H.js';
+export { SlideGrid } from '../chunk-7MGXHCVK.js';
 import '../chunk-RMEBFYL7.js';
 import '../chunk-OMV5W53A.js';
 import '../chunk-H5XTJ7GJ.js';