rei-kit 2.21.0 → 2.22.0

package/dist/styles.css

@@ -25,7 +25,7 @@
 }
 }
 
-.rk-fab-slot[data-v-3bd0d80a] {
+.rk-fab-slot[data-v-d4cdec97] {
   position: absolute;
   bottom: calc(6rem + env(safe-area-inset-bottom, 0px));
   left: 50%;
@@ -40,15 +40,15 @@
      must not swallow taps meant for the page underneath it. */
   pointer-events: none;
 }
-.rk-fab[data-v-3bd0d80a] {
+.rk-fab[data-v-d4cdec97] {
   pointer-events: auto;
   display: flex;
   height: 3rem;
   align-items: center;
   gap: 0.375rem;
   border-radius: 9999px;
-  padding-left: 1rem;
-  padding-right: 1.25rem;
+  padding-inline-start: 1rem;
+  padding-inline-end: 1.25rem;
   color: var(--color-on-primary);
   background: var(--color-primary);
   transition: transform var(--duration-fast);
@@ -59,7 +59,7 @@
     0 0 0 4px var(--color-canvas),
     var(--shadow-raised);
 }
-.rk-fab[data-v-3bd0d80a]:active {
+.rk-fab[data-v-d4cdec97]:active {
   transform: translate(var(--press-offset), var(--press-offset)) scale(var(--press-scale));
 }
 
@@ -67,27 +67,27 @@
    in the app it came from, which meant it inherited a focus ring for free; a
    bare <button> here would have dropped it, and a keyboard user would have had
    no way to see where they were. */
-.rk-fab[data-v-3bd0d80a]:focus-visible {
+.rk-fab[data-v-d4cdec97]:focus-visible {
   outline: 2px solid var(--color-primary);
   outline-offset: 2px;
 }
-.rk-fab-icon[data-v-3bd0d80a] {
+.rk-fab-icon[data-v-d4cdec97] {
   display: grid;
   place-items: center;
   flex-shrink: 0;
 }
-.rk-fab-icon[data-v-3bd0d80a] svg {
+.rk-fab-icon[data-v-d4cdec97] svg {
   width: 1.25rem;
   height: 1.25rem;
   stroke-width: 2.5px;
 }
-.rk-fab-label[data-v-3bd0d80a] {
+.rk-fab-label[data-v-d4cdec97] {
   font-size: 0.875rem;
   font-weight: 600;
   white-space: nowrap;
 }
 @media (prefers-reduced-motion: reduce) {
-.rk-fab[data-v-3bd0d80a] {
+.rk-fab[data-v-d4cdec97] {
     transition: none;
 }
 }
@@ -137,7 +137,7 @@
    The colour is a custom property because it is the one thing each app wants
    different: set `--rk-lattice` on any ancestor. It defaults to the ink colour,
    which is legible against every theme the tokens can produce. */
-.rk-screen[data-v-211d6411] {
+.rk-screen[data-v-ad677e07] {
   position: fixed;
   inset: 0;
   display: flex;
@@ -169,10 +169,10 @@
     ),
     var(--canvas-backdrop);
 }
-.rk-screen-aside[data-v-211d6411] {
+.rk-screen-aside[data-v-ad677e07] {
   position: absolute;
   bottom: 1.5rem;
-  left: 1.5rem;
+  inset-inline-start: 1.5rem;
   display: none;
   flex-direction: column;
   gap: 0.25rem;
@@ -180,14 +180,14 @@
   color: var(--color-ink-soft);
 }
 @media (min-width: 48rem) {
-.rk-screen-aside[data-v-211d6411] {
+.rk-screen-aside[data-v-ad677e07] {
     display: flex;
 }
 }
 
 /* `shell-frame` from `rei-kit/shell/mobile.css` supplies the geometry — the
    430px column and the desktop height. This adds only the surface. */
-.rk-shell[data-v-211d6411] {
+.rk-shell[data-v-ad677e07] {
   position: relative;
   margin: auto;
   display: flex;
@@ -198,7 +198,7 @@
   -webkit-backdrop-filter: var(--surface-backdrop);
 }
 @media (min-width: 48rem) {
-.rk-shell[data-v-211d6411] {
+.rk-shell[data-v-ad677e07] {
     border: var(--surface-border-width) solid var(--surface-border-color);
     border-radius: var(--radius-shell);
     box-shadow: var(--shadow-overlay);
@@ -246,6 +246,75 @@
 }
 }
 
+.rk-scroll[data-v-4c21cdc9] {
+  position: relative;
+  min-width: 0;
+  min-height: 0;
+}
+.rk-scroll-viewport[data-v-4c21cdc9] {
+  max-width: 100%;
+  max-height: 100%;
+}
+.rk-scroll-viewport.is-x[data-v-4c21cdc9] {
+  overflow-x: auto;
+  overflow-y: hidden;
+}
+.rk-scroll-viewport.is-y[data-v-4c21cdc9] {
+  overflow-x: hidden;
+  overflow-y: auto;
+}
+.rk-scroll-viewport.is-both[data-v-4c21cdc9] {
+  overflow: auto;
+}
+.rk-scroll-viewport[data-v-4c21cdc9]:focus-visible {
+  outline: 2px solid var(--color-primary);
+  outline-offset: 2px;
+}
+
+/* The fade paints over whatever the box sits on, so the colour is a hook:
+   a scroll area on a card sets it to the card's ground. */
+.rk-scroll-fade[data-v-4c21cdc9] {
+  position: absolute;
+  z-index: 1;
+  pointer-events: none;
+  --rk-scroll-fade: var(--scroll-fade-color, var(--color-canvas));
+}
+.rk-scroll-fade.is-start-x[data-v-4c21cdc9],
+.rk-scroll-fade.is-end-x[data-v-4c21cdc9] {
+  inset-block: 0;
+  width: 1.5rem;
+}
+.rk-scroll-fade.is-start-y[data-v-4c21cdc9],
+.rk-scroll-fade.is-end-y[data-v-4c21cdc9] {
+  inset-inline: 0;
+  height: 1.5rem;
+}
+.rk-scroll-fade.is-start-x[data-v-4c21cdc9] {
+  inset-inline-start: 0;
+  background: linear-gradient(to right, var(--rk-scroll-fade), transparent);
+}
+.rk-scroll-fade.is-end-x[data-v-4c21cdc9] {
+  inset-inline-end: 0;
+  background: linear-gradient(to left, var(--rk-scroll-fade), transparent);
+}
+.rk-scroll-fade.is-start-y[data-v-4c21cdc9] {
+  inset-block-start: 0;
+  background: linear-gradient(to bottom, var(--rk-scroll-fade), transparent);
+}
+.rk-scroll-fade.is-end-y[data-v-4c21cdc9] {
+  inset-block-end: 0;
+  background: linear-gradient(to top, var(--rk-scroll-fade), transparent);
+}
+
+/* The insets are logical, so they land on the correct side on their own.
+   A gradient has no logical direction, so these two flip by hand. */
+[dir='rtl'] .rk-scroll-fade.is-start-x[data-v-4c21cdc9] {
+  background: linear-gradient(to left, var(--rk-scroll-fade), transparent);
+}
+[dir='rtl'] .rk-scroll-fade.is-end-x[data-v-4c21cdc9] {
+  background: linear-gradient(to right, var(--rk-scroll-fade), transparent);
+}
+
 .rk-listbox[data-v-7f8cd788] {
   overflow-y: auto;
   border-radius: var(--radius-card);
@@ -345,19 +414,19 @@
   height: 65%;
 }
 
-.rk-menu[data-v-ee62de72] {
+.rk-menu[data-v-eaeecb75] {
   position: relative;
   display: inline-flex;
 }
-.rk-menu-trigger[data-v-ee62de72] {
+.rk-menu-trigger[data-v-eaeecb75] {
   display: inline-flex;
   border-radius: var(--radius-cell);
 }
-.rk-menu-trigger[data-v-ee62de72]:focus-visible {
+.rk-menu-trigger[data-v-eaeecb75]:focus-visible {
   outline: 2px solid var(--color-primary);
   outline-offset: 2px;
 }
-.rk-menu-panel[data-v-ee62de72] {
+.rk-menu-panel[data-v-eaeecb75] {
   position: absolute;
   top: calc(100% + 0.5rem);
   z-index: 50;
@@ -366,51 +435,51 @@
   border-radius: var(--radius-card);
   padding: 0.375rem;
 }
-.rk-menu-panel.is-end[data-v-ee62de72] {
-  right: 0;
+.rk-menu-panel.is-end[data-v-eaeecb75] {
+  inset-inline-end: 0;
 }
-.rk-menu-panel.is-start[data-v-ee62de72] {
-  left: 0;
+.rk-menu-panel.is-start[data-v-eaeecb75] {
+  inset-inline-start: 0;
 }
 
 /* The items belong to the caller, so this styles them by role rather than by
    class: whatever they render, it lines up. */
-.rk-menu-panel[data-v-ee62de72] [role='menuitem'] {
+.rk-menu-panel[data-v-eaeecb75] [role='menuitem'] {
   display: block;
   width: 100%;
   border-radius: var(--radius-cell);
   padding: 0.5rem 0.75rem;
-  text-align: left;
+  text-align: start;
   font-size: 0.875rem;
   color: var(--color-ink);
   transition: background-color var(--duration-fast);
 }
-.rk-menu-panel[data-v-ee62de72] [role='menuitem']:hover {
+.rk-menu-panel[data-v-eaeecb75] [role='menuitem']:hover {
   background: var(--color-muted);
 }
-.rk-menu-panel[data-v-ee62de72] [role='menuitem']:focus-visible {
+.rk-menu-panel[data-v-eaeecb75] [role='menuitem']:focus-visible {
   outline: 2px solid var(--color-primary);
   outline-offset: -2px;
 }
-.rk-menu-panel[data-v-ee62de72] hr {
+.rk-menu-panel[data-v-eaeecb75] hr {
   margin: 0.375rem 0;
   height: 1px;
   border: 0;
   background: color-mix(in srgb, var(--color-hair) 70%, transparent);
 }
 
-.rk-combo[data-v-006740dc] {
+.rk-combo[data-v-0ae3b425] {
   position: relative;
   display: flex;
   flex-direction: column;
   gap: 0.375rem;
 }
-.rk-combo-label[data-v-006740dc] {
+.rk-combo-label[data-v-0ae3b425] {
   font-size: 0.875rem;
   font-weight: 500;
   color: var(--color-ink);
 }
-.rk-combo-field[data-v-006740dc] {
+.rk-combo-field[data-v-0ae3b425] {
   position: relative;
   display: flex;
   align-items: center;
@@ -418,14 +487,14 @@
 
 /* With chips the field is a box that wraps, and the input is one item in it
    that grows into whatever is left. */
-.rk-combo-field.is-multiple[data-v-006740dc] {
+.rk-combo-field.is-multiple[data-v-0ae3b425] {
   flex-wrap: wrap;
   gap: 0.25rem;
   min-height: 2.75rem;
   border-radius: var(--radius-card);
   padding: 0.3125rem 2rem 0.3125rem 0.375rem;
 }
-.rk-combo-chip[data-v-006740dc] {
+.rk-combo-chip[data-v-0ae3b425] {
   display: inline-flex;
   align-items: center;
   gap: 0.25rem;
@@ -435,7 +504,7 @@
   font-size: 0.8125rem;
   color: var(--color-ink);
 }
-.rk-combo-chip-x[data-v-006740dc] {
+.rk-combo-chip-x[data-v-0ae3b425] {
   display: grid;
   width: 1.125rem;
   height: 1.125rem;
@@ -444,13 +513,13 @@
   color: var(--color-ink-soft);
   line-height: 1;
 }
-.rk-combo-chip-x[data-v-006740dc]:hover {
+.rk-combo-chip-x[data-v-0ae3b425]:hover {
   color: var(--color-ink);
 }
 
 /* 16px, like every other text control here: iOS zooms the viewport when it
    focuses a field under 16px and never zooms back. */
-.rk-combo-input[data-v-006740dc] {
+.rk-combo-input[data-v-0ae3b425] {
   width: 100%;
   height: 2.75rem;
   border-radius: var(--radius-card);
@@ -458,7 +527,7 @@
   font-size: 1rem;
   color: var(--color-ink);
 }
-.is-multiple .rk-combo-input[data-v-006740dc] {
+.is-multiple .rk-combo-input[data-v-0ae3b425] {
   width: auto;
   height: 1.75rem;
   min-width: 6rem;
@@ -469,29 +538,29 @@
   background: transparent;
   box-shadow: none;
 }
-.rk-combo-input[data-v-006740dc]:focus-visible {
+.rk-combo-input[data-v-0ae3b425]:focus-visible {
   outline: 2px solid var(--color-primary);
   outline-offset: -1px;
 }
-.is-multiple .rk-combo-input[data-v-006740dc]:focus-visible {
+.is-multiple .rk-combo-input[data-v-0ae3b425]:focus-visible {
   outline: none;
 }
 
 /* The ring belongs to the whole box once the box is the control. */
-.rk-combo-field.is-multiple[data-v-006740dc]:focus-within {
+.rk-combo-field.is-multiple[data-v-0ae3b425]:focus-within {
   outline: 2px solid var(--color-primary);
   outline-offset: -1px;
 }
-.rk-combo-input[data-v-006740dc]:disabled {
+.rk-combo-input[data-v-0ae3b425]:disabled {
   opacity: 0.5;
 }
-.rk-combo-toggle[data-v-006740dc] {
+.rk-combo-toggle[data-v-0ae3b425] {
   position: absolute;
-  right: 0.5rem;
+  inset-inline-end: 0.5rem;
   color: var(--color-ink-soft);
   font-size: 0.75rem;
 }
-.rk-combo-list[data-v-006740dc] {
+.rk-combo-list[data-v-0ae3b425] {
   position: absolute;
   top: calc(100% - 1.25rem);
   z-index: 50;
@@ -501,7 +570,7 @@
   border-radius: var(--radius-card);
   padding: 0.25rem;
 }
-.rk-combo-option[data-v-006740dc] {
+.rk-combo-option[data-v-0ae3b425] {
   cursor: pointer;
   border-radius: var(--radius-cell);
   padding: 0.5rem 0.625rem;
@@ -511,38 +580,38 @@
 
 /* A virtual row's height is the arithmetic the spacers are built on, so it
    cannot be left to the text inside it. */
-.rk-combo-option[style][data-v-006740dc] {
+.rk-combo-option[style][data-v-0ae3b425] {
   display: flex;
   align-items: center;
   padding-block: 0;
 }
-.rk-combo-option.is-highlighted[data-v-006740dc] {
+.rk-combo-option.is-highlighted[data-v-0ae3b425] {
   background: var(--color-muted);
 }
-.rk-combo-option.is-selected[data-v-006740dc] {
+.rk-combo-option.is-selected[data-v-0ae3b425] {
   font-weight: 600;
 }
-.rk-combo-empty[data-v-006740dc],
-.rk-combo-status[data-v-006740dc] {
+.rk-combo-empty[data-v-0ae3b425],
+.rk-combo-status[data-v-0ae3b425] {
   padding: 0.75rem 0.625rem;
   font-size: 0.875rem;
   color: var(--color-ink-soft);
 }
-.rk-combo-status[data-v-006740dc] {
+.rk-combo-status[data-v-0ae3b425] {
   display: flex;
   flex-direction: column;
   gap: 0.5rem;
 }
-.rk-combo-status-rows[data-v-006740dc] {
+.rk-combo-status-rows[data-v-0ae3b425] {
   display: flex;
   flex-direction: column;
   gap: 0.5rem;
 }
-.rk-combo-error[data-v-006740dc] {
+.rk-combo-error[data-v-0ae3b425] {
   font-size: 0.75rem;
   color: var(--color-negative);
 }
-.rk-combo-hint[data-v-006740dc] {
+.rk-combo-hint[data-v-0ae3b425] {
   font-size: 0.75rem;
   color: var(--color-ink-soft);
 }
@@ -743,7 +812,7 @@ to {
 }
 }
 
-.rk-switch[data-v-3f4400a0] {
+.rk-switch[data-v-d90e1aa6] {
   position: relative;
   display: inline-flex;
   flex-shrink: 0;
@@ -754,20 +823,20 @@ to {
   background: var(--color-hair);
   transition: background-color var(--duration-base) ease;
 }
-.rk-switch.is-on[data-v-3f4400a0] {
+.rk-switch.is-on[data-v-d90e1aa6] {
   background: var(--color-primary);
 }
-.rk-switch[data-v-3f4400a0]:focus-visible {
+.rk-switch[data-v-d90e1aa6]:focus-visible {
   outline: 2px solid var(--color-primary);
   outline-offset: 2px;
 }
-.rk-switch[data-v-3f4400a0]:disabled {
+.rk-switch[data-v-d90e1aa6]:disabled {
   opacity: 0.5;
   pointer-events: none;
 }
-.rk-switch-knob[data-v-3f4400a0] {
+.rk-switch-knob[data-v-d90e1aa6] {
   position: absolute;
-  left: 0.1875rem;
+  inset-inline-start: 0.1875rem;
   width: 1.25rem;
   height: 1.25rem;
   border-radius: 9999px;
@@ -777,38 +846,37 @@ to {
   box-shadow: var(--shadow-control);
   transition: transform var(--duration-base) var(--ease-sheet);
 }
-.rk-switch.is-on .rk-switch-knob[data-v-3f4400a0] {
+.rk-switch.is-on .rk-switch-knob[data-v-d90e1aa6] {
   transform: translateX(1.125rem);
 }
+
+/* `translateX` has no logical form, so the one direction-dependent value in
+   the kit that cannot be written logically is written twice. Without this
+   the knob leaves the track entirely in a right-to-left layout. */
+[dir='rtl'] .rk-switch.is-on .rk-switch-knob[data-v-d90e1aa6] {
+  transform: translateX(-1.125rem);
+}
 @media (prefers-reduced-motion: reduce) {
-.rk-switch[data-v-3f4400a0],
-  .rk-switch-knob[data-v-3f4400a0] {
+.rk-switch[data-v-d90e1aa6],
+  .rk-switch-knob[data-v-d90e1aa6] {
     transition: none;
 }
 }
 
-.rk-table-scroll[data-v-ab10e9fa] {
-  overflow-x: auto;
-}
-.rk-table-scroll[data-v-ab10e9fa]:focus-visible {
-  outline: 2px solid var(--color-primary);
-  outline-offset: 2px;
-  border-radius: var(--radius-cell);
-}
-.rk-table[data-v-ab10e9fa] {
+.rk-table[data-v-cc1197ef] {
   width: 100%;
   border-collapse: collapse;
   font-size: 0.875rem;
 }
-.rk-table-caption[data-v-ab10e9fa] {
+.rk-table-caption[data-v-cc1197ef] {
   padding-bottom: 0.75rem;
-  text-align: left;
+  text-align: start;
   font-size: 0.8125rem;
   color: var(--color-ink-soft);
 }
 
 /* Off screen rather than `display: none`, which is not announced at all. */
-.rk-table-caption-hidden[data-v-ab10e9fa] {
+.rk-table-caption-hidden[data-v-cc1197ef] {
   position: absolute;
   width: 1px;
   height: 1px;
@@ -816,21 +884,21 @@ to {
   clip-path: inset(50%);
   white-space: nowrap;
 }
-.rk-table th[data-v-ab10e9fa] {
+.rk-table th[data-v-cc1197ef] {
   border-bottom: 1px solid var(--color-hair);
   padding: 0.625rem 0.75rem;
-  text-align: left;
+  text-align: start;
   font-weight: 500;
   color: var(--color-ink-soft);
   white-space: nowrap;
 }
-.rk-table td[data-v-ab10e9fa] {
+.rk-table td[data-v-cc1197ef] {
   border-bottom: 1px solid color-mix(in srgb, var(--color-hair) 50%, transparent);
   padding: 0.75rem;
   color: var(--color-ink);
   vertical-align: top;
 }
-.rk-table tbody tr:last-child td[data-v-ab10e9fa] {
+.rk-table tbody tr:last-child td[data-v-cc1197ef] {
   border-bottom: 0;
 }
 
@@ -838,23 +906,23 @@ to {
    Both the heading and the cells, and named against `.rk-table th` rather
    than on its own: a bare `.is-end` loses to it, and the column then reads as
    two columns — a heading on the left and its numbers far off to the right. */
-.rk-table th.is-end[data-v-ab10e9fa],
-.rk-table td.is-end[data-v-ab10e9fa] {
-  text-align: right;
+.rk-table th.is-end[data-v-cc1197ef],
+.rk-table td.is-end[data-v-cc1197ef] {
+  text-align: end;
   font-variant-numeric: tabular-nums;
 }
-.rk-table th.is-center[data-v-ab10e9fa],
-.rk-table td.is-center[data-v-ab10e9fa] {
+.rk-table th.is-center[data-v-cc1197ef],
+.rk-table td.is-center[data-v-cc1197ef] {
   text-align: center;
 }
-.rk-table th.is-start[data-v-ab10e9fa],
-.rk-table td.is-start[data-v-ab10e9fa] {
-  text-align: left;
+.rk-table th.is-start[data-v-cc1197ef],
+.rk-table td.is-start[data-v-cc1197ef] {
+  text-align: start;
 }
-.is-nowrap[data-v-ab10e9fa] {
+.is-nowrap[data-v-cc1197ef] {
   white-space: nowrap;
 }
-.rk-table-empty[data-v-ab10e9fa] {
+.rk-table-empty[data-v-cc1197ef] {
   padding: 2rem 0.75rem;
   text-align: center;
   color: var(--color-ink-soft);
@@ -1111,107 +1179,85 @@ to {
   outline-offset: 1px;
 }
 
-.rk-scroll[data-v-4c21cdc9] {
-  position: relative;
-  min-width: 0;
-  min-height: 0;
-}
-.rk-scroll-viewport[data-v-4c21cdc9] {
-  max-width: 100%;
-  max-height: 100%;
-}
-.rk-scroll-viewport.is-x[data-v-4c21cdc9] {
-  overflow-x: auto;
-  overflow-y: hidden;
-}
-.rk-scroll-viewport.is-y[data-v-4c21cdc9] {
-  overflow-x: hidden;
-  overflow-y: auto;
-}
-.rk-scroll-viewport.is-both[data-v-4c21cdc9] {
-  overflow: auto;
+.rk-vlist-rows[data-v-936ed40c] {
+  margin: 0;
+  padding: 0;
+  list-style: none;
 }
-.rk-scroll-viewport[data-v-4c21cdc9]:focus-visible {
-  outline: 2px solid var(--color-primary);
-  outline-offset: 2px;
+.rk-vlist-row[data-v-936ed40c] {
+  box-sizing: border-box;
+  overflow: hidden;
 }
 
-/* The fade paints over whatever the box sits on, so the colour is a hook:
-   a scroll area on a card sets it to the card's ground. */
-.rk-scroll-fade[data-v-4c21cdc9] {
+/* Clipped rather than `display: none`: a hidden live region is not read at
+   all, which is the quietest possible way for this to fail. */
+.rk-announcer[data-v-205d6703] {
   position: absolute;
-  z-index: 1;
-  pointer-events: none;
-  --rk-scroll-fade: var(--scroll-fade-color, var(--color-canvas));
-}
-.rk-scroll-fade.is-start-x[data-v-4c21cdc9],
-.rk-scroll-fade.is-end-x[data-v-4c21cdc9] {
-  inset-block: 0;
-  width: 1.5rem;
-}
-.rk-scroll-fade.is-start-y[data-v-4c21cdc9],
-.rk-scroll-fade.is-end-y[data-v-4c21cdc9] {
-  inset-inline: 0;
-  height: 1.5rem;
+  overflow: hidden;
+  width: 1px;
+  height: 1px;
+  margin: -1px;
+  padding: 0;
+  border: 0;
+  clip-path: inset(50%);
+  white-space: nowrap;
 }
-.rk-scroll-fade.is-start-x[data-v-4c21cdc9] {
-  inset-inline-start: 0;
-  background: linear-gradient(to right, var(--rk-scroll-fade), transparent);
+
+.rk-errsum[data-v-4a68e342] {
+  border: 2px solid var(--color-negative);
+  border-radius: var(--radius-card);
+  padding: 0.875rem 1rem;
 }
-.rk-scroll-fade.is-end-x[data-v-4c21cdc9] {
-  inset-inline-end: 0;
-  background: linear-gradient(to left, var(--rk-scroll-fade), transparent);
+.rk-errsum[data-v-4a68e342]:focus-visible {
+  outline: 2px solid var(--color-primary);
+  outline-offset: 2px;
 }
-.rk-scroll-fade.is-start-y[data-v-4c21cdc9] {
-  inset-block-start: 0;
-  background: linear-gradient(to bottom, var(--rk-scroll-fade), transparent);
+.rk-errsum-title[data-v-4a68e342] {
+  margin: 0;
+  color: var(--color-negative);
+  font-size: 0.875rem;
+  font-weight: 600;
 }
-.rk-scroll-fade.is-end-y[data-v-4c21cdc9] {
-  inset-block-end: 0;
-  background: linear-gradient(to top, var(--rk-scroll-fade), transparent);
+.rk-errsum-list[data-v-4a68e342] {
+  margin: 0.5rem 0 0;
+  padding-inline-start: 1.125rem;
+  color: var(--color-negative);
+  font-size: 0.8125rem;
 }
-
-/* The insets are logical, so they land on the correct side on their own.
-   A gradient has no logical direction, so these two flip by hand. */
-[dir='rtl'] .rk-scroll-fade.is-start-x[data-v-4c21cdc9] {
-  background: linear-gradient(to left, var(--rk-scroll-fade), transparent);
+.rk-errsum-list li + li[data-v-4a68e342] {
+  margin-block-start: 0.25rem;
 }
-[dir='rtl'] .rk-scroll-fade.is-end-x[data-v-4c21cdc9] {
-  background: linear-gradient(to right, var(--rk-scroll-fade), transparent);
-}
-
-.rk-vlist-rows[data-v-936ed40c] {
-  margin: 0;
-  padding: 0;
-  list-style: none;
+.rk-errsum-link[data-v-4a68e342] {
+  color: inherit;
+  text-decoration: underline;
 }
-.rk-vlist-row[data-v-936ed40c] {
-  box-sizing: border-box;
-  overflow: hidden;
+.rk-errsum-link[data-v-4a68e342]:focus-visible {
+  outline: 2px solid var(--color-primary);
+  outline-offset: 2px;
 }
 
-.rk-stack[data-v-db629481] {
+.rk-stack[data-v-1f87913c] {
   display: inline-flex;
   align-items: center;
 }
 
 /* Overlapped by a third, with a ring in the page's own colour so each face
    keeps an edge against the one under it — on any material. */
-.rk-stack-item + .rk-stack-item[data-v-db629481] {
-  margin-left: -0.5rem;
+.rk-stack-item + .rk-stack-item[data-v-1f87913c] {
+  margin-inline-start: -0.5rem;
 }
-.rk-stack.is-sm .rk-stack-item + .rk-stack-item[data-v-db629481] {
-  margin-left: -0.5rem;
+.rk-stack.is-sm .rk-stack-item + .rk-stack-item[data-v-1f87913c] {
+  margin-inline-start: -0.5rem;
 }
-.rk-stack.is-lg .rk-stack-item + .rk-stack-item[data-v-db629481] {
-  margin-left: -0.875rem;
+.rk-stack.is-lg .rk-stack-item + .rk-stack-item[data-v-1f87913c] {
+  margin-inline-start: -0.875rem;
 }
-.rk-stack-item[data-v-db629481] {
+.rk-stack-item[data-v-1f87913c] {
   display: inline-flex;
   border-radius: 9999px;
   box-shadow: 0 0 0 2px var(--color-surface);
 }
-.rk-stack-rest[data-v-db629481] {
+.rk-stack-rest[data-v-1f87913c] {
   display: inline-grid;
   width: 2.25rem;
   height: 2.25rem;
@@ -1222,12 +1268,12 @@ to {
   color: var(--color-ink-soft);
   font-variant-numeric: tabular-nums;
 }
-.rk-stack.is-sm .rk-stack-rest[data-v-db629481] {
+.rk-stack.is-sm .rk-stack-rest[data-v-1f87913c] {
   width: 1.75rem;
   height: 1.75rem;
   font-size: 0.6875rem;
 }
-.rk-stack.is-lg .rk-stack-rest[data-v-db629481] {
+.rk-stack.is-lg .rk-stack-rest[data-v-1f87913c] {
   width: 3rem;
   height: 3rem;
   font-size: 0.8125rem;
@@ -1777,7 +1823,7 @@ to {
   color: var(--color-ink);
 }
 
-.rk-drop-box[data-v-a42eab69] {
+.rk-drop-box[data-v-6e903baf] {
   display: flex;
   cursor: pointer;
   flex-direction: column;
@@ -1794,28 +1840,28 @@ to {
 }
 
 /* The box is a label, so the ring belongs to the input it names. */
-.rk-drop-box[data-v-a42eab69]:has(input:focus-visible) {
+.rk-drop-box[data-v-6e903baf]:has(input:focus-visible) {
   outline: 2px solid var(--color-primary);
   outline-offset: 2px;
 }
-.rk-drop-box.is-over[data-v-a42eab69] {
+.rk-drop-box.is-over[data-v-6e903baf] {
   border-color: var(--color-primary);
   background: color-mix(in oklab, var(--color-primary) 8%, transparent);
 }
-.rk-drop-box.is-disabled[data-v-a42eab69] {
+.rk-drop-box.is-disabled[data-v-6e903baf] {
   cursor: not-allowed;
   opacity: 0.5;
 }
-.rk-drop-label[data-v-a42eab69] {
+.rk-drop-label[data-v-6e903baf] {
   font-size: 0.875rem;
   font-weight: 500;
   color: var(--color-ink);
 }
-.rk-drop-hint[data-v-a42eab69] {
+.rk-drop-hint[data-v-6e903baf] {
   font-size: 0.75rem;
   color: var(--color-ink-soft);
 }
-.rk-drop-browse[data-v-a42eab69] {
+.rk-drop-browse[data-v-6e903baf] {
   margin-top: 0.25rem;
   border-radius: 9999px;
   background: var(--color-muted);
@@ -1824,18 +1870,18 @@ to {
   font-weight: 500;
   color: var(--color-ink);
 }
-.rk-drop-error[data-v-a42eab69] {
+.rk-drop-error[data-v-6e903baf] {
   margin-top: 0.5rem;
   font-size: 0.8125rem;
   color: var(--color-negative);
 }
-.rk-drop-files[data-v-a42eab69] {
+.rk-drop-files[data-v-6e903baf] {
   margin-top: 0.75rem;
   display: flex;
   flex-direction: column;
   gap: 0.375rem;
 }
-.rk-drop-file[data-v-a42eab69] {
+.rk-drop-file[data-v-6e903baf] {
   display: flex;
   align-items: center;
   gap: 0.5rem;
@@ -1844,14 +1890,14 @@ to {
   font-size: 0.8125rem;
   color: var(--color-ink);
 }
-.rk-drop-size[data-v-a42eab69] {
-  margin-left: auto;
+.rk-drop-size[data-v-6e903baf] {
+  margin-inline-start: auto;
   flex-shrink: 0;
   font-size: 0.75rem;
   font-variant-numeric: tabular-nums;
   color: var(--color-ink-soft);
 }
-.rk-drop-remove[data-v-a42eab69] {
+.rk-drop-remove[data-v-6e903baf] {
   display: grid;
   width: 1.5rem;
   height: 1.5rem;
@@ -1860,7 +1906,7 @@ to {
   border-radius: 9999px;
   color: var(--color-ink-soft);
 }
-.rk-drop-remove[data-v-a42eab69]:hover {
+.rk-drop-remove[data-v-6e903baf]:hover {
   background: var(--color-muted);
   color: var(--color-ink);
 }
@@ -1900,11 +1946,11 @@ to {
   outline: none;
 }
 
-.rk-popover[data-v-1371bff2] {
+.rk-popover[data-v-22d8f397] {
   position: relative;
   display: inline-flex;
 }
-.rk-popover-panel[data-v-1371bff2] {
+.rk-popover-panel[data-v-22d8f397] {
   position: absolute;
   z-index: 50;
   min-width: 14rem;
@@ -1913,46 +1959,46 @@ to {
   padding: 0.75rem;
   translate: var(--rk-popover-shift, 0) 0;
 }
-.rk-popover-panel[data-v-1371bff2]:focus-visible {
+.rk-popover-panel[data-v-22d8f397]:focus-visible {
   outline: 2px solid var(--color-primary);
   outline-offset: 2px;
 }
-.rk-popover-panel.is-bottom[data-v-1371bff2] {
+.rk-popover-panel.is-bottom[data-v-22d8f397] {
   top: calc(100% + 0.5rem);
 }
-.rk-popover-panel.is-top[data-v-1371bff2] {
+.rk-popover-panel.is-top[data-v-22d8f397] {
   bottom: calc(100% + 0.5rem);
 }
-.rk-popover-panel.is-start[data-v-1371bff2] {
-  left: 0;
+.rk-popover-panel.is-start[data-v-22d8f397] {
+  inset-inline-start: 0;
 }
-.rk-popover-panel.is-end[data-v-1371bff2] {
-  right: 0;
+.rk-popover-panel.is-end[data-v-22d8f397] {
+  inset-inline-end: 0;
 }
-.rk-popover-panel.is-center[data-v-1371bff2] {
+.rk-popover-panel.is-center[data-v-22d8f397] {
   left: 50%;
   translate: calc(-50% + var(--rk-popover-shift, 0px)) 0;
 }
-.rk-popover-enter-active[data-v-1371bff2],
-.rk-popover-leave-active[data-v-1371bff2] {
+.rk-popover-enter-active[data-v-22d8f397],
+.rk-popover-leave-active[data-v-22d8f397] {
   transition:
     opacity var(--duration-fast) var(--ease-standard),
     transform var(--duration-fast) var(--ease-standard);
 }
-.rk-popover-enter-from[data-v-1371bff2],
-.rk-popover-leave-to[data-v-1371bff2] {
+.rk-popover-enter-from[data-v-22d8f397],
+.rk-popover-leave-to[data-v-22d8f397] {
   opacity: 0;
   transform: translateY(-4px) scale(0.98);
 }
-.rk-popover-panel.is-top.rk-popover-enter-from[data-v-1371bff2],
-.rk-popover-panel.is-top.rk-popover-leave-to[data-v-1371bff2] {
+.rk-popover-panel.is-top.rk-popover-enter-from[data-v-22d8f397],
+.rk-popover-panel.is-top.rk-popover-leave-to[data-v-22d8f397] {
   transform: translateY(4px) scale(0.98);
 }
 
-.rk-time[data-v-0037adb2] {
+.rk-time[data-v-ad58b4f3] {
   display: block;
 }
-.rk-time-field[data-v-0037adb2] {
+.rk-time-field[data-v-ad58b4f3] {
   display: flex;
   width: 100%;
   height: 2.75rem;
@@ -1960,59 +2006,59 @@ to {
   gap: 0.5rem;
   border-radius: var(--radius-card);
   padding: 0 0.75rem;
-  text-align: left;
+  text-align: start;
   font-size: 1rem;
   font-variant-numeric: tabular-nums;
   color: var(--color-ink);
 }
-.rk-time-field.is-empty[data-v-0037adb2] {
+.rk-time-field.is-empty[data-v-ad58b4f3] {
   color: var(--color-ink-soft);
 }
-.rk-time-field.is-invalid[data-v-0037adb2] {
+.rk-time-field.is-invalid[data-v-ad58b4f3] {
   --surface-border-color: var(--color-negative);
 }
-.rk-time-field[data-v-0037adb2]:disabled {
+.rk-time-field[data-v-ad58b4f3]:disabled {
   opacity: 0.5;
 }
-.rk-time-columns[data-v-0037adb2] {
+.rk-time-columns[data-v-ad58b4f3] {
   display: grid;
   grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
   gap: 0.5rem;
   width: 14rem;
 }
 
-.rk-timeline[data-v-08b15ce8] {
+.rk-timeline[data-v-8a452f82] {
   position: relative;
   display: flex;
   flex-direction: column;
   gap: 1rem;
-  padding-left: 1.5rem;
+  padding-inline-start: 1.5rem;
 }
 
 /* Stops short of both ends: a line running past the first and last dots
    reads as a sequence that continues out of view. */
-.rk-timeline-rail[data-v-08b15ce8] {
+.rk-timeline-rail[data-v-8a452f82] {
   position: absolute;
   top: 0.5rem;
   bottom: 0.75rem;
-  left: 0.25rem;
+  inset-inline-start: 0.25rem;
   width: 1px;
   background: var(--color-hair);
 }
-.rk-timeline-event[data-v-08b15ce8] {
+.rk-timeline-event[data-v-8a452f82] {
   position: relative;
 }
-.rk-timeline-marker[data-v-08b15ce8] {
+.rk-timeline-marker[data-v-8a452f82] {
   position: absolute;
   top: 0.125rem;
-  left: -1.5rem;
+  inset-inline-start: -1.5rem;
   display: grid;
   place-items: center;
 }
 
 /* The ring is the page's own ground, so the dot sits on the rail rather
    than being crossed by it. */
-.rk-timeline-dot[data-v-08b15ce8] {
+.rk-timeline-dot[data-v-8a452f82] {
   display: grid;
   width: 0.625rem;
   height: 0.625rem;
@@ -2021,46 +2067,46 @@ to {
   border: 2px solid var(--color-canvas);
   color: var(--color-on-primary);
 }
-.rk-timeline-time[data-v-08b15ce8] {
+.rk-timeline-time[data-v-8a452f82] {
   font-size: 0.75rem;
   font-weight: 500;
   font-variant-numeric: tabular-nums;
   color: var(--color-ink-soft);
 }
-.rk-timeline-title[data-v-08b15ce8] {
+.rk-timeline-title[data-v-8a452f82] {
   margin-top: 0.125rem;
   font-size: 0.875rem;
   font-weight: 600;
   color: var(--color-ink);
 }
-.rk-timeline-description[data-v-08b15ce8] {
+.rk-timeline-description[data-v-8a452f82] {
   margin-top: 0.125rem;
   font-size: 0.875rem;
   line-height: 1.5;
   color: var(--color-ink-soft);
 }
-.rk-timeline-body[data-v-08b15ce8] {
+.rk-timeline-body[data-v-8a452f82] {
   margin-top: 0.5rem;
 }
 
-.rk-date[data-v-154e27fb] {
+.rk-date[data-v-42390973] {
   display: block;
 }
 
 /* Wider than a popover's default: a calendar and a column of presets side by
    side do not fit in 24rem, and the month title wraps in two. */
-.rk-date[data-v-154e27fb] .rk-popover-panel {
+.rk-date[data-v-42390973] .rk-popover-panel {
   max-width: min(34rem, calc(100vw - 1rem));
 }
-.rk-date-wrap[data-v-154e27fb] {
+.rk-date-wrap[data-v-42390973] {
   display: flex;
   width: 100%;
   height: 2.75rem;
   align-items: center;
   border-radius: var(--radius-card);
-  padding-right: 0.375rem;
+  padding-inline-end: 0.375rem;
 }
-.rk-date-field[data-v-154e27fb] {
+.rk-date-field[data-v-42390973] {
   display: flex;
   min-width: 0;
   flex: 1;
@@ -2069,20 +2115,20 @@ to {
   gap: 0.5rem;
   border-radius: var(--radius-card);
   padding: 0 0.75rem;
-  text-align: left;
+  text-align: start;
   font-size: 1rem;
   color: var(--color-ink);
 }
-.rk-date-field.is-empty[data-v-154e27fb] {
+.rk-date-field.is-empty[data-v-42390973] {
   color: var(--color-ink-soft);
 }
-.rk-date-wrap.is-invalid[data-v-154e27fb] {
+.rk-date-wrap.is-invalid[data-v-42390973] {
   --surface-border-color: var(--color-negative);
 }
-.rk-date-field[data-v-154e27fb]:disabled {
+.rk-date-field[data-v-42390973]:disabled {
   opacity: 0.5;
 }
-.rk-date-clear[data-v-154e27fb] {
+.rk-date-clear[data-v-42390973] {
   display: grid;
   width: 1.375rem;
   height: 1.375rem;
@@ -2091,59 +2137,59 @@ to {
   border-radius: 9999px;
   color: var(--color-ink-soft);
 }
-.rk-date-clear[data-v-154e27fb]:hover {
+.rk-date-clear[data-v-42390973]:hover {
   background: var(--color-muted);
   color: var(--color-ink);
 }
-.rk-date-clear[data-v-154e27fb]:focus-visible {
+.rk-date-clear[data-v-42390973]:focus-visible {
   outline: 2px solid var(--color-primary);
   outline-offset: 1px;
 }
 
 /* As wide as its contents rather than as narrow as they will go: in a flex
    panel the calendar shrinks, and a squeezed month title wraps in two. */
-.rk-date-panel[data-v-154e27fb] {
+.rk-date-panel[data-v-42390973] {
   display: flex;
   width: max-content;
   max-width: 100%;
   gap: 0.75rem;
 }
-.rk-date-panel[data-v-154e27fb] .rk-cal {
+.rk-date-panel[data-v-42390973] .rk-cal {
   width: 17rem;
 }
-.rk-date-presets[data-v-154e27fb] {
+.rk-date-presets[data-v-42390973] {
   display: flex;
   min-width: 8rem;
   flex-direction: column;
   gap: 2px;
-  border-right: 1px solid var(--surface-border-color);
-  padding-right: 0.75rem;
+  border-inline-end: 1px solid var(--surface-border-color);
+  padding-inline-end: 0.75rem;
 }
-.rk-date-preset[data-v-154e27fb] {
+.rk-date-preset[data-v-42390973] {
   width: 100%;
   border-radius: var(--radius-cell);
   padding: 0.375rem 0.5rem;
-  text-align: left;
+  text-align: start;
   font-size: 0.8125rem;
   color: var(--color-ink);
   transition: background-color var(--duration-fast) var(--ease-standard);
 }
-.rk-date-preset[data-v-154e27fb]:hover {
+.rk-date-preset[data-v-42390973]:hover {
   background: var(--color-muted);
 }
 @media (max-width: 30rem) {
-.rk-date-panel[data-v-154e27fb] {
+.rk-date-panel[data-v-42390973] {
     flex-direction: column;
 }
-.rk-date-presets[data-v-154e27fb] {
+.rk-date-presets[data-v-42390973] {
     flex-direction: row;
     flex-wrap: wrap;
-    border-right: 0;
+    border-inline-end: 0;
     border-bottom: 1px solid var(--surface-border-color);
-    padding-right: 0;
+    padding-inline-end: 0;
     padding-bottom: 0.5rem;
 }
-.rk-date-preset[data-v-154e27fb] {
+.rk-date-preset[data-v-42390973] {
     width: auto;
 }
 }
@@ -2321,63 +2367,63 @@ to {
 }
 }
 
-.rk-steps[data-v-6aa3221b] {
+.rk-steps[data-v-f7513d9a] {
   display: flex;
   gap: 0.5rem;
 }
-.rk-steps.is-horizontal[data-v-6aa3221b] {
+.rk-steps.is-horizontal[data-v-f7513d9a] {
   align-items: flex-start;
 }
-.rk-steps.is-vertical[data-v-6aa3221b] {
+.rk-steps.is-vertical[data-v-f7513d9a] {
   flex-direction: column;
   gap: 0;
 }
-.rk-step[data-v-6aa3221b] {
+.rk-step[data-v-f7513d9a] {
   position: relative;
   flex: 1;
   min-width: 0;
 }
 
 /* The connecting line, drawn from each step to the next. */
-.rk-step[data-v-6aa3221b]:not(:last-child)::after {
+.rk-step[data-v-f7513d9a]:not(:last-child)::after {
   content: '';
   position: absolute;
   background: var(--color-hair);
   transition: background-color var(--duration-base) var(--ease-standard);
 }
-.is-horizontal .rk-step[data-v-6aa3221b]:not(:last-child)::after {
+.is-horizontal .rk-step[data-v-f7513d9a]:not(:last-child)::after {
   top: 0.875rem;
-  left: calc(1.75rem + 0.5rem);
-  right: 0.5rem;
+  inset-inline-start: calc(1.75rem + 0.5rem);
+  inset-inline-end: 0.5rem;
   height: 2px;
 }
-.is-vertical .rk-step[data-v-6aa3221b]:not(:last-child)::after {
+.is-vertical .rk-step[data-v-f7513d9a]:not(:last-child)::after {
   top: 2.125rem;
   bottom: 0.25rem;
-  left: 0.8125rem;
+  inset-inline-start: 0.8125rem;
   width: 2px;
 }
-.rk-step.is-complete[data-v-6aa3221b]::after {
+.rk-step.is-complete[data-v-f7513d9a]::after {
   background: var(--color-primary);
 }
-.rk-step-body[data-v-6aa3221b] {
+.rk-step-body[data-v-f7513d9a] {
   display: flex;
   align-items: flex-start;
   gap: 0.625rem;
   width: 100%;
   border-radius: var(--radius-cell);
-  text-align: left;
+  text-align: start;
 }
-.is-horizontal .rk-step-body[data-v-6aa3221b] {
+.is-horizontal .rk-step-body[data-v-f7513d9a] {
   flex-direction: column;
 }
-.is-vertical .rk-step-body[data-v-6aa3221b] {
+.is-vertical .rk-step-body[data-v-f7513d9a] {
   padding-bottom: 1.5rem;
 }
-.rk-step-body.is-clickable[data-v-6aa3221b] {
+.rk-step-body.is-clickable[data-v-f7513d9a] {
   cursor: pointer;
 }
-.rk-step-mark[data-v-6aa3221b] {
+.rk-step-mark[data-v-f7513d9a] {
   position: relative;
   z-index: 1;
   display: grid;
@@ -2396,43 +2442,43 @@ to {
     border-color var(--duration-base) var(--ease-standard),
     color var(--duration-base) var(--ease-standard);
 }
-.is-current .rk-step-mark[data-v-6aa3221b] {
+.is-current .rk-step-mark[data-v-f7513d9a] {
   border-color: var(--color-primary);
   color: var(--color-primary);
 }
-.is-complete .rk-step-mark[data-v-6aa3221b] {
+.is-complete .rk-step-mark[data-v-f7513d9a] {
   border-color: var(--color-primary);
   background: var(--color-primary);
   color: var(--color-on-primary);
 }
-.is-error .rk-step-mark[data-v-6aa3221b] {
+.is-error .rk-step-mark[data-v-f7513d9a] {
   border-color: var(--color-negative);
   background: var(--color-negative);
   color: var(--color-on-negative);
 }
-.is-clickable:hover .rk-step-mark[data-v-6aa3221b] {
+.is-clickable:hover .rk-step-mark[data-v-f7513d9a] {
   box-shadow: 0 0 0 4px color-mix(in oklab, var(--color-primary) 18%, transparent);
 }
-.rk-step-text[data-v-6aa3221b] {
+.rk-step-text[data-v-f7513d9a] {
   display: flex;
   min-width: 0;
   flex-direction: column;
   gap: 0.125rem;
   padding-top: 0.25rem;
 }
-.rk-step-label[data-v-6aa3221b] {
+.rk-step-label[data-v-f7513d9a] {
   font-size: 0.8125rem;
   font-weight: 600;
   color: var(--color-ink-soft);
 }
-.is-current .rk-step-label[data-v-6aa3221b],
-.is-complete .rk-step-label[data-v-6aa3221b] {
+.is-current .rk-step-label[data-v-f7513d9a],
+.is-complete .rk-step-label[data-v-f7513d9a] {
   color: var(--color-ink);
 }
-.is-error .rk-step-label[data-v-6aa3221b] {
+.is-error .rk-step-label[data-v-f7513d9a] {
   color: var(--color-negative);
 }
-.rk-step-description[data-v-6aa3221b] {
+.rk-step-description[data-v-f7513d9a] {
   font-size: 0.75rem;
   line-height: 1.4;
   color: var(--color-ink-soft);
@@ -2498,27 +2544,27 @@ to {
   filter: blur(4px);
 }
 
-.rk-type[data-v-05f176ab] {
+.rk-type[data-v-591b5cef] {
   white-space: pre-wrap;
 }
 
 /* A bar the height of the text, in its colour. */
-.rk-type-cursor[data-v-05f176ab] {
+.rk-type-cursor[data-v-591b5cef] {
   display: inline-block;
   width: 0.08em;
   height: 1em;
-  margin-left: 0.06em;
+  margin-inline-start: 0.06em;
   vertical-align: -0.12em;
   background: currentColor;
-  animation: rk-type-blink-05f176ab 1s steps(1) infinite;
+  animation: rk-type-blink-591b5cef 1s steps(1) infinite;
 }
-@keyframes rk-type-blink-05f176ab {
+@keyframes rk-type-blink-591b5cef {
 50% {
     opacity: 0;
 }
 }
 @media (prefers-reduced-motion: reduce) {
-.rk-type-cursor[data-v-05f176ab] {
+.rk-type-cursor[data-v-591b5cef] {
     animation: none;
 }
 }
@@ -2661,13 +2707,13 @@ to {
 }
 }
 
-.rk-accordion[data-v-03e2e1d0] {
+.rk-accordion[data-v-d558aa6a] {
   border-top: 1px solid color-mix(in srgb, var(--color-hair) 70%, transparent);
 }
-.rk-accordion-item[data-v-03e2e1d0] {
+.rk-accordion-item[data-v-d558aa6a] {
   border-bottom: 1px solid color-mix(in srgb, var(--color-hair) 70%, transparent);
 }
-.rk-accordion-control[data-v-03e2e1d0] {
+.rk-accordion-control[data-v-d558aa6a] {
   display: flex;
   width: 100%;
   cursor: pointer;
@@ -2675,22 +2721,22 @@ to {
   justify-content: space-between;
   gap: 1.5rem;
   padding: 1.25rem 0;
-  text-align: left;
+  text-align: start;
   transition: color var(--duration-fast);
 }
-.rk-accordion-control[data-v-03e2e1d0]:hover {
+.rk-accordion-control[data-v-d558aa6a]:hover {
   color: var(--color-primary);
 }
-.rk-accordion-control[data-v-03e2e1d0]:focus-visible {
+.rk-accordion-control[data-v-d558aa6a]:focus-visible {
   outline: 2px solid var(--color-primary);
   outline-offset: 2px;
 }
-.rk-accordion-title[data-v-03e2e1d0] {
+.rk-accordion-title[data-v-d558aa6a] {
   color: var(--color-ink);
   font-size: 1rem;
   font-weight: 500;
 }
-.rk-accordion-mark[data-v-03e2e1d0] {
+.rk-accordion-mark[data-v-d558aa6a] {
   position: relative;
   display: grid;
   place-items: center;
@@ -2698,34 +2744,34 @@ to {
   width: 1.5rem;
   height: 1.5rem;
 }
-.rk-accordion-bar[data-v-03e2e1d0] {
+.rk-accordion-bar[data-v-d558aa6a] {
   position: absolute;
   height: 1px;
   width: 0.875rem;
   background: var(--color-ink-soft);
 }
-.rk-accordion-bar-turn[data-v-03e2e1d0] {
+.rk-accordion-bar-turn[data-v-d558aa6a] {
   transform: rotate(90deg);
   transition: transform var(--duration-slower) ease-out;
 }
-.rk-accordion-bar-turn.is-open[data-v-03e2e1d0] {
+.rk-accordion-bar-turn.is-open[data-v-d558aa6a] {
   transform: rotate(0deg);
 }
 
 /* 0fr to 1fr is the whole trick: a grid row can be animated to a height that
    was never measured, which is what `height: auto` cannot do. */
-.rk-accordion-panel[data-v-03e2e1d0] {
+.rk-accordion-panel[data-v-d558aa6a] {
   display: grid;
   grid-template-rows: 0fr;
   transition: grid-template-rows var(--duration-slower) ease-out;
 }
-.rk-accordion-panel.is-open[data-v-03e2e1d0] {
+.rk-accordion-panel.is-open[data-v-d558aa6a] {
   grid-template-rows: 1fr;
 }
-.rk-accordion-clip[data-v-03e2e1d0] {
+.rk-accordion-clip[data-v-d558aa6a] {
   overflow: hidden;
 }
-.rk-accordion-body[data-v-03e2e1d0] {
+.rk-accordion-body[data-v-d558aa6a] {
   max-width: 68ch;
   padding-bottom: 1.5rem;
   color: var(--color-ink-soft);
@@ -2733,13 +2779,13 @@ to {
   opacity: 0;
   transition: opacity var(--duration-slow);
 }
-.rk-accordion-body.is-open[data-v-03e2e1d0] {
+.rk-accordion-body.is-open[data-v-d558aa6a] {
   opacity: 1;
 }
 @media (prefers-reduced-motion: reduce) {
-.rk-accordion-panel[data-v-03e2e1d0],
-  .rk-accordion-bar-turn[data-v-03e2e1d0],
-  .rk-accordion-body[data-v-03e2e1d0] {
+.rk-accordion-panel[data-v-d558aa6a],
+  .rk-accordion-bar-turn[data-v-d558aa6a],
+  .rk-accordion-body[data-v-d558aa6a] {
     transition: none;
 }
 }
@@ -2827,7 +2873,7 @@ to {
   border-block-start: 1px solid var(--color-hair);
 }
 
-.rk-disclosure-control[data-v-ad5c09f5] {
+.rk-disclosure-control[data-v-f3a3f8c7] {
   display: flex;
   width: 100%;
   cursor: pointer;
@@ -2835,22 +2881,22 @@ to {
   justify-content: space-between;
   gap: 1.5rem;
   padding: 1.25rem 0;
-  text-align: left;
+  text-align: start;
   transition: color var(--duration-fast);
 }
-.rk-disclosure-control[data-v-ad5c09f5]:hover {
+.rk-disclosure-control[data-v-f3a3f8c7]:hover {
   color: var(--color-primary);
 }
-.rk-disclosure-control[data-v-ad5c09f5]:focus-visible {
+.rk-disclosure-control[data-v-f3a3f8c7]:focus-visible {
   outline: 2px solid var(--color-primary);
   outline-offset: 2px;
 }
-.rk-disclosure-title[data-v-ad5c09f5] {
+.rk-disclosure-title[data-v-f3a3f8c7] {
   color: var(--color-ink);
   font-size: 1rem;
   font-weight: 500;
 }
-.rk-disclosure-mark[data-v-ad5c09f5] {
+.rk-disclosure-mark[data-v-f3a3f8c7] {
   position: relative;
   display: grid;
   place-items: center;
@@ -2858,34 +2904,34 @@ to {
   width: 1.5rem;
   height: 1.5rem;
 }
-.rk-disclosure-bar[data-v-ad5c09f5] {
+.rk-disclosure-bar[data-v-f3a3f8c7] {
   position: absolute;
   height: 1px;
   width: 0.875rem;
   background: var(--color-ink-soft);
 }
-.rk-disclosure-turn[data-v-ad5c09f5] {
+.rk-disclosure-turn[data-v-f3a3f8c7] {
   transform: rotate(90deg);
   transition: transform var(--duration-slower) ease-out;
 }
-.rk-disclosure-turn.is-open[data-v-ad5c09f5] {
+.rk-disclosure-turn.is-open[data-v-f3a3f8c7] {
   transform: rotate(0deg);
 }
 
 /* 0fr to 1fr is the whole trick: a grid row can be animated to a height that
    was never measured, which `height: auto` cannot do. */
-.rk-disclosure-panel[data-v-ad5c09f5] {
+.rk-disclosure-panel[data-v-f3a3f8c7] {
   display: grid;
   grid-template-rows: 0fr;
   transition: grid-template-rows var(--duration-slower) ease-out;
 }
-.rk-disclosure-panel.is-open[data-v-ad5c09f5] {
+.rk-disclosure-panel.is-open[data-v-f3a3f8c7] {
   grid-template-rows: 1fr;
 }
-.rk-disclosure-clip[data-v-ad5c09f5] {
+.rk-disclosure-clip[data-v-f3a3f8c7] {
   overflow: hidden;
 }
-.rk-disclosure-body[data-v-ad5c09f5] {
+.rk-disclosure-body[data-v-f3a3f8c7] {
   max-width: 68ch;
   padding-bottom: 1.5rem;
   color: var(--color-ink-soft);
@@ -2893,13 +2939,13 @@ to {
   opacity: 0;
   transition: opacity var(--duration-slow);
 }
-.rk-disclosure-body.is-open[data-v-ad5c09f5] {
+.rk-disclosure-body.is-open[data-v-f3a3f8c7] {
   opacity: 1;
 }
 @media (prefers-reduced-motion: reduce) {
-.rk-disclosure-panel[data-v-ad5c09f5],
-  .rk-disclosure-turn[data-v-ad5c09f5],
-  .rk-disclosure-body[data-v-ad5c09f5] {
+.rk-disclosure-panel[data-v-f3a3f8c7],
+  .rk-disclosure-turn[data-v-f3a3f8c7],
+  .rk-disclosure-body[data-v-f3a3f8c7] {
     transition: none;
 }
 }
@@ -3229,7 +3275,7 @@ to {
   color: var(--color-ink-soft);
 }
 
-.rk-command[data-v-f72521e7] {
+.rk-command[data-v-64849895] {
   position: fixed;
   inset: 0;
   z-index: 90;
@@ -3240,13 +3286,13 @@ to {
      grows downwards into space rather than pushing itself off both edges. */
   padding-top: min(12vh, 6rem);
 }
-.rk-command-scrim[data-v-f72521e7] {
+.rk-command-scrim[data-v-64849895] {
   position: absolute;
   inset: 0;
   background: color-mix(in oklab, var(--color-ink) 45%, transparent);
   backdrop-filter: blur(2px);
 }
-.rk-command-panel[data-v-f72521e7] {
+.rk-command-panel[data-v-64849895] {
   position: relative;
   display: flex;
   width: 100%;
@@ -3256,14 +3302,14 @@ to {
   overflow: hidden;
   border-radius: var(--radius-card);
 }
-.rk-command-field[data-v-f72521e7] {
+.rk-command-field[data-v-64849895] {
   display: flex;
   align-items: center;
   gap: 0.625rem;
   border-bottom: 1px solid var(--surface-border-color);
   padding: 0.875rem 1rem;
 }
-.rk-command-input[data-v-f72521e7] {
+.rk-command-input[data-v-64849895] {
   min-width: 0;
   flex: 1;
   background: transparent;
@@ -3275,15 +3321,15 @@ to {
 /* The field takes focus the moment this opens, so a full ring around it
    would be on the whole time. The rule under it turns instead: enough to
    say where the keyboard is, quiet enough to live with. */
-.rk-command-field[data-v-f72521e7]:has(.rk-command-input:focus-visible) {
+.rk-command-field[data-v-64849895]:has(.rk-command-input:focus-visible) {
   border-bottom-color: var(--color-primary);
   box-shadow: inset 0 -1px 0 var(--color-primary);
 }
-.rk-command-list[data-v-f72521e7] {
+.rk-command-list[data-v-64849895] {
   overflow-y: auto;
   padding: 0.375rem;
 }
-.rk-command-group[data-v-f72521e7] {
+.rk-command-group[data-v-64849895] {
   padding: 0.5rem 0.625rem 0.25rem;
   font-size: 0.6875rem;
   font-weight: 600;
@@ -3291,7 +3337,7 @@ to {
   text-transform: uppercase;
   color: var(--color-ink-soft);
 }
-.rk-command-item[data-v-f72521e7] {
+.rk-command-item[data-v-64849895] {
   display: flex;
   cursor: pointer;
   align-items: center;
@@ -3301,60 +3347,56 @@ to {
   font-size: 0.875rem;
   color: var(--color-ink);
 }
-.rk-command-item.is-active[data-v-f72521e7] {
+.rk-command-item.is-active[data-v-64849895] {
   background: var(--color-muted);
 }
-.rk-command-hint[data-v-f72521e7] {
-  margin-left: auto;
+.rk-command-hint[data-v-64849895] {
+  margin-inline-start: auto;
   flex-shrink: 0;
   font-size: 0.75rem;
   color: var(--color-ink-soft);
 }
-.rk-command-empty[data-v-f72521e7] {
+.rk-command-empty[data-v-64849895] {
   padding: 1.5rem 0.625rem;
   text-align: center;
   font-size: 0.875rem;
   color: var(--color-ink-soft);
 }
-.rk-command-enter-active[data-v-f72521e7],
-.rk-command-leave-active[data-v-f72521e7] {
+.rk-command-enter-active[data-v-64849895],
+.rk-command-leave-active[data-v-64849895] {
   transition: opacity var(--duration-fast) var(--ease-standard);
 }
-.rk-command-enter-active .rk-command-panel[data-v-f72521e7],
-.rk-command-leave-active .rk-command-panel[data-v-f72521e7] {
+.rk-command-enter-active .rk-command-panel[data-v-64849895],
+.rk-command-leave-active .rk-command-panel[data-v-64849895] {
   transition: transform var(--duration-fast) var(--ease-standard);
 }
-.rk-command-enter-from[data-v-f72521e7],
-.rk-command-leave-to[data-v-f72521e7] {
+.rk-command-enter-from[data-v-64849895],
+.rk-command-leave-to[data-v-64849895] {
   opacity: 0;
 }
-.rk-command-enter-from .rk-command-panel[data-v-f72521e7],
-.rk-command-leave-to .rk-command-panel[data-v-f72521e7] {
+.rk-command-enter-from .rk-command-panel[data-v-64849895],
+.rk-command-leave-to .rk-command-panel[data-v-64849895] {
   transform: translateY(-0.5rem) scale(0.98);
 }
 
-/* The scroller is focusable: a region only a drag can reach is a region a
-   keyboard cannot read at all. */
-.rk-data-scroll[data-v-f95c586b] {
-  overflow-x: auto;
+/* `ScrollArea` owns the scrolling and decides whether this is a focus
+   stop: with selection or a sortable column there is already a way in for
+   a keyboard, and a stop of its own would be a press for nothing. */
+.rk-data-scroll[data-v-54510109] {
   border-radius: var(--radius-card);
 }
-.rk-data-scroll[data-v-f95c586b]:focus-visible {
-  outline: 2px solid var(--color-primary);
-  outline-offset: 2px;
-}
-.rk-data[data-v-f95c586b] {
+.rk-data[data-v-54510109] {
   width: 100%;
   border-collapse: collapse;
   font-size: 0.875rem;
 }
-.rk-data-caption[data-v-f95c586b] {
+.rk-data-caption[data-v-54510109] {
   padding-bottom: 0.5rem;
-  text-align: left;
+  text-align: start;
   font-size: 0.8125rem;
   color: var(--color-ink-soft);
 }
-.rk-data-caption-hidden[data-v-f95c586b] {
+.rk-data-caption-hidden[data-v-54510109] {
   position: absolute;
   width: 1px;
   height: 1px;
@@ -3362,32 +3404,32 @@ to {
   clip-path: inset(50%);
   white-space: nowrap;
 }
-.rk-data th[data-v-f95c586b] {
+.rk-data th[data-v-54510109] {
   border-bottom: 1px solid var(--color-hair);
   padding: 0.625rem 0.75rem;
-  text-align: left;
+  text-align: start;
   font-size: 0.75rem;
   font-weight: 600;
   letter-spacing: 0.02em;
   color: var(--color-ink-soft);
   white-space: nowrap;
 }
-.rk-data.is-sticky thead th[data-v-f95c586b] {
+.rk-data.is-sticky thead th[data-v-54510109] {
   position: sticky;
   top: 0;
   z-index: 1;
   background: var(--color-surface);
 }
-.rk-data td[data-v-f95c586b] {
+.rk-data td[data-v-54510109] {
   border-bottom: 1px solid color-mix(in oklab, var(--color-hair) 60%, transparent);
   padding: 0.625rem 0.75rem;
   color: var(--color-ink);
   vertical-align: middle;
 }
-.rk-data tbody tr:last-child td[data-v-f95c586b] {
+.rk-data tbody tr:last-child td[data-v-54510109] {
   border-bottom: 0;
 }
-.rk-data tbody tr.is-chosen td[data-v-f95c586b] {
+.rk-data tbody tr.is-chosen td[data-v-54510109] {
   background: color-mix(in oklab, var(--color-primary) 8%, transparent);
 }
 
@@ -3395,23 +3437,23 @@ to {
    otherwise win: the heading stayed on the left while its numbers sat at the
    far edge, so one column read as two. The sort button is inline-flex, so it
    follows the heading's alignment and carries the arrow with it. */
-.rk-data th.is-end[data-v-f95c586b],
-.rk-data td.is-end[data-v-f95c586b] {
-  text-align: right;
+.rk-data th.is-end[data-v-54510109],
+.rk-data td.is-end[data-v-54510109] {
+  text-align: end;
   font-variant-numeric: tabular-nums;
 }
-.rk-data th.is-center[data-v-f95c586b],
-.rk-data td.is-center[data-v-f95c586b] {
+.rk-data th.is-center[data-v-54510109],
+.rk-data td.is-center[data-v-54510109] {
   text-align: center;
 }
-.rk-data th.is-start[data-v-f95c586b],
-.rk-data td.is-start[data-v-f95c586b] {
-  text-align: left;
+.rk-data th.is-start[data-v-54510109],
+.rk-data td.is-start[data-v-54510109] {
+  text-align: start;
 }
-.is-nowrap[data-v-f95c586b] {
+.is-nowrap[data-v-54510109] {
   white-space: nowrap;
 }
-.rk-data-sort[data-v-f95c586b] {
+.rk-data-sort[data-v-54510109] {
   display: inline-flex;
   align-items: center;
   gap: 0.25rem;
@@ -3419,19 +3461,14 @@ to {
   color: inherit;
   transition: color var(--duration-fast) var(--ease-standard);
 }
-.rk-data-sort[data-v-f95c586b]:hover {
+.rk-data-sort[data-v-54510109]:hover {
   color: var(--color-ink);
 }
-.rk-data-pick[data-v-f95c586b] {
+.rk-data-pick[data-v-54510109] {
   width: 2.75rem;
-  padding-right: 0;
-}
-.rk-data-box[data-v-f95c586b] {
-  width: 1rem;
-  height: 1rem;
-  accent-color: var(--color-primary);
+  padding-inline-end: 0;
 }
-.rk-data-empty[data-v-f95c586b] {
+.rk-data-empty[data-v-54510109] {
   padding: 2rem 0.75rem;
   text-align: center;
   color: var(--color-ink-soft);
@@ -3694,18 +3731,18 @@ to {
 }
 }
 
-.rk-mega[data-v-9c8be532] {
+.rk-mega[data-v-a6df77ff] {
   position: relative;
 }
-.rk-mega-bar[data-v-9c8be532] {
+.rk-mega-bar[data-v-a6df77ff] {
   display: flex;
   align-items: center;
   gap: 0.25rem;
 }
-.rk-mega-item[data-v-9c8be532] {
+.rk-mega-item[data-v-a6df77ff] {
   position: static;
 }
-.rk-mega-top[data-v-9c8be532] {
+.rk-mega-top[data-v-a6df77ff] {
   display: inline-flex;
   align-items: center;
   gap: 0.25rem;
@@ -3716,42 +3753,42 @@ to {
   color: var(--color-ink-soft);
   transition: color var(--duration-fast) var(--ease-standard);
 }
-.rk-mega-top[data-v-9c8be532]:hover,
-.rk-mega-top[aria-expanded='true'][data-v-9c8be532] {
+.rk-mega-top[data-v-a6df77ff]:hover,
+.rk-mega-top[aria-expanded='true'][data-v-a6df77ff] {
   color: var(--color-ink);
 }
-.rk-mega-top.is-active[data-v-9c8be532] {
+.rk-mega-top.is-active[data-v-a6df77ff] {
   color: var(--color-primary);
 }
-.rk-mega-twist[data-v-9c8be532] {
+.rk-mega-twist[data-v-a6df77ff] {
   width: 0.875rem;
   height: 0.875rem;
   transition: rotate var(--duration-fast) var(--ease-standard);
 }
-.rk-mega-twist.is-open[data-v-9c8be532] {
+.rk-mega-twist.is-open[data-v-a6df77ff] {
   rotate: 180deg;
 }
 
 /* Full width of the bar rather than of the button: that is what makes it a
    mega menu and not a dropdown. */
-.rk-mega-panel[data-v-9c8be532] {
+.rk-mega-panel[data-v-a6df77ff] {
   position: absolute;
   top: calc(100% + 0.5rem);
-  left: 0;
+  inset-inline-start: 0;
   z-index: 50;
   width: 100%;
   border-radius: var(--radius-card);
   padding: 1.25rem;
 }
-.rk-mega-panel[hidden][data-v-9c8be532] {
+.rk-mega-panel[hidden][data-v-a6df77ff] {
   display: none;
 }
-.rk-mega-columns[data-v-9c8be532] {
+.rk-mega-columns[data-v-a6df77ff] {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
   gap: 1.5rem;
 }
-.rk-mega-column-title[data-v-9c8be532] {
+.rk-mega-column-title[data-v-a6df77ff] {
   margin-bottom: 0.5rem;
   font-size: 0.6875rem;
   font-weight: 600;
@@ -3759,26 +3796,26 @@ to {
   text-transform: uppercase;
   color: var(--color-ink-soft);
 }
-.rk-mega-links[data-v-9c8be532] {
+.rk-mega-links[data-v-a6df77ff] {
   display: flex;
   flex-direction: column;
   gap: 1px;
 }
-.rk-mega-link[data-v-9c8be532] {
+.rk-mega-link[data-v-a6df77ff] {
   display: block;
   border-radius: var(--radius-cell);
   padding: 0.375rem 0.5rem;
   transition: background-color var(--duration-fast) var(--ease-standard);
 }
-.rk-mega-link[data-v-9c8be532]:hover {
+.rk-mega-link[data-v-a6df77ff]:hover {
   background: var(--color-muted);
 }
-.rk-mega-link-label[data-v-9c8be532] {
+.rk-mega-link-label[data-v-a6df77ff] {
   display: block;
   font-size: 0.875rem;
   color: var(--color-ink);
 }
-.rk-mega-link-note[data-v-9c8be532] {
+.rk-mega-link-note[data-v-a6df77ff] {
   display: block;
   margin-top: 0.125rem;
   font-size: 0.75rem;
@@ -3789,10 +3826,10 @@ to {
 /* On a narrow screen the panel is the page width and the columns stack,
    because a four-column grid in a 390px column is four unreadable columns. */
 @media (max-width: 48rem) {
-.rk-mega-panel[data-v-9c8be532] {
+.rk-mega-panel[data-v-a6df77ff] {
     padding: 1rem;
 }
-.rk-mega-columns[data-v-9c8be532] {
+.rk-mega-columns[data-v-a6df77ff] {
     grid-template-columns: minmax(0, 1fr);
     gap: 1rem;
 }
@@ -3852,4 +3889,34 @@ to {
     transition: none;
 }
 }
+
+/* Clipped rather than hidden: `display: none` and `visibility: hidden` both
+   take it out of the tab order, and then it is a link nobody can reach. */
+.rk-skip[data-v-cafce238] {
+  position: absolute;
+  z-index: 100;
+  overflow: hidden;
+  width: 1px;
+  height: 1px;
+  clip-path: inset(50%);
+  white-space: nowrap;
+}
+.rk-skip[data-v-cafce238]:focus-visible {
+  inset-block-start: 0.5rem;
+  inset-inline-start: 0.5rem;
+  overflow: visible;
+  width: auto;
+  height: auto;
+  padding: 0.5rem 0.875rem;
+  border-radius: var(--radius-card);
+  outline: 2px solid var(--color-primary);
+  outline-offset: 2px;
+  background: var(--color-surface);
+  box-shadow: var(--shadow-overlay);
+  clip-path: none;
+  color: var(--color-ink);
+  font-size: 0.875rem;
+  font-weight: 500;
+  text-decoration: none;
+}
 /*$vite$:1*/