rei-kit 2.20.0 → 2.22.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (35) hide show
  1. package/README.md +3 -3
  2. package/dist/{BaseListbox-Btibgnaf.js → BaseListbox-DMR-Zn1u.js} +232 -4
  3. package/dist/BaseListbox-DMR-Zn1u.js.map +1 -0
  4. package/dist/app/guards.d.ts +43 -1
  5. package/dist/app/index.d.ts +1 -1
  6. package/dist/app.js +51 -5
  7. package/dist/app.js.map +1 -1
  8. package/dist/components/AnnounceHost.vue.d.ts +3 -0
  9. package/dist/components/BaseCheckbox.vue.d.ts +19 -0
  10. package/dist/components/ErrorSummary.vue.d.ts +60 -0
  11. package/dist/components/FormField.vue.d.ts +6 -0
  12. package/dist/components/ScrollArea.vue.d.ts +68 -0
  13. package/dist/components/VirtualList.vue.d.ts +37 -0
  14. package/dist/composables/use-announce.d.ts +65 -0
  15. package/dist/composables/use-virtual-window.d.ts +39 -0
  16. package/dist/{BaseSheet-B7401rS7.js → focus-target-D0WsXwKh.js} +109 -9
  17. package/dist/focus-target-D0WsXwKh.js.map +1 -0
  18. package/dist/index.d.ts +33 -0
  19. package/dist/index.js +443 -262
  20. package/dist/index.js.map +1 -1
  21. package/dist/motion.js +1 -1
  22. package/dist/motion.js.map +1 -1
  23. package/dist/styles.css +469 -323
  24. package/dist/{GoogleButton-mCqGbrXm.js → use-announce-B1LsfsZx.js} +59 -86
  25. package/dist/use-announce-B1LsfsZx.js.map +1 -0
  26. package/dist/utils/direction.d.ts +20 -0
  27. package/dist/utils/focus-target.d.ts +18 -0
  28. package/dist/web/SkipLink.vue.d.ts +43 -0
  29. package/dist/web/index.d.ts +6 -0
  30. package/dist/web.js +154 -133
  31. package/dist/web.js.map +1 -1
  32. package/package.json +2 -2
  33. package/dist/BaseListbox-Btibgnaf.js.map +0 -1
  34. package/dist/BaseSheet-B7401rS7.js.map +0 -1
  35. package/dist/GoogleButton-mCqGbrXm.js.map +0 -1
package/dist/styles.css CHANGED
@@ -25,7 +25,7 @@
25
25
  }
26
26
  }
27
27
 
28
- .rk-fab-slot[data-v-3bd0d80a] {
28
+ .rk-fab-slot[data-v-d4cdec97] {
29
29
  position: absolute;
30
30
  bottom: calc(6rem + env(safe-area-inset-bottom, 0px));
31
31
  left: 50%;
@@ -40,15 +40,15 @@
40
40
  must not swallow taps meant for the page underneath it. */
41
41
  pointer-events: none;
42
42
  }
43
- .rk-fab[data-v-3bd0d80a] {
43
+ .rk-fab[data-v-d4cdec97] {
44
44
  pointer-events: auto;
45
45
  display: flex;
46
46
  height: 3rem;
47
47
  align-items: center;
48
48
  gap: 0.375rem;
49
49
  border-radius: 9999px;
50
- padding-left: 1rem;
51
- padding-right: 1.25rem;
50
+ padding-inline-start: 1rem;
51
+ padding-inline-end: 1.25rem;
52
52
  color: var(--color-on-primary);
53
53
  background: var(--color-primary);
54
54
  transition: transform var(--duration-fast);
@@ -59,7 +59,7 @@
59
59
  0 0 0 4px var(--color-canvas),
60
60
  var(--shadow-raised);
61
61
  }
62
- .rk-fab[data-v-3bd0d80a]:active {
62
+ .rk-fab[data-v-d4cdec97]:active {
63
63
  transform: translate(var(--press-offset), var(--press-offset)) scale(var(--press-scale));
64
64
  }
65
65
 
@@ -67,27 +67,27 @@
67
67
  in the app it came from, which meant it inherited a focus ring for free; a
68
68
  bare <button> here would have dropped it, and a keyboard user would have had
69
69
  no way to see where they were. */
70
- .rk-fab[data-v-3bd0d80a]:focus-visible {
70
+ .rk-fab[data-v-d4cdec97]:focus-visible {
71
71
  outline: 2px solid var(--color-primary);
72
72
  outline-offset: 2px;
73
73
  }
74
- .rk-fab-icon[data-v-3bd0d80a] {
74
+ .rk-fab-icon[data-v-d4cdec97] {
75
75
  display: grid;
76
76
  place-items: center;
77
77
  flex-shrink: 0;
78
78
  }
79
- .rk-fab-icon[data-v-3bd0d80a] svg {
79
+ .rk-fab-icon[data-v-d4cdec97] svg {
80
80
  width: 1.25rem;
81
81
  height: 1.25rem;
82
82
  stroke-width: 2.5px;
83
83
  }
84
- .rk-fab-label[data-v-3bd0d80a] {
84
+ .rk-fab-label[data-v-d4cdec97] {
85
85
  font-size: 0.875rem;
86
86
  font-weight: 600;
87
87
  white-space: nowrap;
88
88
  }
89
89
  @media (prefers-reduced-motion: reduce) {
90
- .rk-fab[data-v-3bd0d80a] {
90
+ .rk-fab[data-v-d4cdec97] {
91
91
  transition: none;
92
92
  }
93
93
  }
@@ -137,7 +137,7 @@
137
137
  The colour is a custom property because it is the one thing each app wants
138
138
  different: set `--rk-lattice` on any ancestor. It defaults to the ink colour,
139
139
  which is legible against every theme the tokens can produce. */
140
- .rk-screen[data-v-211d6411] {
140
+ .rk-screen[data-v-ad677e07] {
141
141
  position: fixed;
142
142
  inset: 0;
143
143
  display: flex;
@@ -169,10 +169,10 @@
169
169
  ),
170
170
  var(--canvas-backdrop);
171
171
  }
172
- .rk-screen-aside[data-v-211d6411] {
172
+ .rk-screen-aside[data-v-ad677e07] {
173
173
  position: absolute;
174
174
  bottom: 1.5rem;
175
- left: 1.5rem;
175
+ inset-inline-start: 1.5rem;
176
176
  display: none;
177
177
  flex-direction: column;
178
178
  gap: 0.25rem;
@@ -180,14 +180,14 @@
180
180
  color: var(--color-ink-soft);
181
181
  }
182
182
  @media (min-width: 48rem) {
183
- .rk-screen-aside[data-v-211d6411] {
183
+ .rk-screen-aside[data-v-ad677e07] {
184
184
  display: flex;
185
185
  }
186
186
  }
187
187
 
188
188
  /* `shell-frame` from `rei-kit/shell/mobile.css` supplies the geometry — the
189
189
  430px column and the desktop height. This adds only the surface. */
190
- .rk-shell[data-v-211d6411] {
190
+ .rk-shell[data-v-ad677e07] {
191
191
  position: relative;
192
192
  margin: auto;
193
193
  display: flex;
@@ -198,7 +198,7 @@
198
198
  -webkit-backdrop-filter: var(--surface-backdrop);
199
199
  }
200
200
  @media (min-width: 48rem) {
201
- .rk-shell[data-v-211d6411] {
201
+ .rk-shell[data-v-ad677e07] {
202
202
  border: var(--surface-border-width) solid var(--surface-border-color);
203
203
  border-radius: var(--radius-shell);
204
204
  box-shadow: var(--shadow-overlay);
@@ -246,6 +246,75 @@
246
246
  }
247
247
  }
248
248
 
249
+ .rk-scroll[data-v-4c21cdc9] {
250
+ position: relative;
251
+ min-width: 0;
252
+ min-height: 0;
253
+ }
254
+ .rk-scroll-viewport[data-v-4c21cdc9] {
255
+ max-width: 100%;
256
+ max-height: 100%;
257
+ }
258
+ .rk-scroll-viewport.is-x[data-v-4c21cdc9] {
259
+ overflow-x: auto;
260
+ overflow-y: hidden;
261
+ }
262
+ .rk-scroll-viewport.is-y[data-v-4c21cdc9] {
263
+ overflow-x: hidden;
264
+ overflow-y: auto;
265
+ }
266
+ .rk-scroll-viewport.is-both[data-v-4c21cdc9] {
267
+ overflow: auto;
268
+ }
269
+ .rk-scroll-viewport[data-v-4c21cdc9]:focus-visible {
270
+ outline: 2px solid var(--color-primary);
271
+ outline-offset: 2px;
272
+ }
273
+
274
+ /* The fade paints over whatever the box sits on, so the colour is a hook:
275
+ a scroll area on a card sets it to the card's ground. */
276
+ .rk-scroll-fade[data-v-4c21cdc9] {
277
+ position: absolute;
278
+ z-index: 1;
279
+ pointer-events: none;
280
+ --rk-scroll-fade: var(--scroll-fade-color, var(--color-canvas));
281
+ }
282
+ .rk-scroll-fade.is-start-x[data-v-4c21cdc9],
283
+ .rk-scroll-fade.is-end-x[data-v-4c21cdc9] {
284
+ inset-block: 0;
285
+ width: 1.5rem;
286
+ }
287
+ .rk-scroll-fade.is-start-y[data-v-4c21cdc9],
288
+ .rk-scroll-fade.is-end-y[data-v-4c21cdc9] {
289
+ inset-inline: 0;
290
+ height: 1.5rem;
291
+ }
292
+ .rk-scroll-fade.is-start-x[data-v-4c21cdc9] {
293
+ inset-inline-start: 0;
294
+ background: linear-gradient(to right, var(--rk-scroll-fade), transparent);
295
+ }
296
+ .rk-scroll-fade.is-end-x[data-v-4c21cdc9] {
297
+ inset-inline-end: 0;
298
+ background: linear-gradient(to left, var(--rk-scroll-fade), transparent);
299
+ }
300
+ .rk-scroll-fade.is-start-y[data-v-4c21cdc9] {
301
+ inset-block-start: 0;
302
+ background: linear-gradient(to bottom, var(--rk-scroll-fade), transparent);
303
+ }
304
+ .rk-scroll-fade.is-end-y[data-v-4c21cdc9] {
305
+ inset-block-end: 0;
306
+ background: linear-gradient(to top, var(--rk-scroll-fade), transparent);
307
+ }
308
+
309
+ /* The insets are logical, so they land on the correct side on their own.
310
+ A gradient has no logical direction, so these two flip by hand. */
311
+ [dir='rtl'] .rk-scroll-fade.is-start-x[data-v-4c21cdc9] {
312
+ background: linear-gradient(to left, var(--rk-scroll-fade), transparent);
313
+ }
314
+ [dir='rtl'] .rk-scroll-fade.is-end-x[data-v-4c21cdc9] {
315
+ background: linear-gradient(to right, var(--rk-scroll-fade), transparent);
316
+ }
317
+
249
318
  .rk-listbox[data-v-7f8cd788] {
250
319
  overflow-y: auto;
251
320
  border-radius: var(--radius-card);
@@ -345,19 +414,19 @@
345
414
  height: 65%;
346
415
  }
347
416
 
348
- .rk-menu[data-v-ee62de72] {
417
+ .rk-menu[data-v-eaeecb75] {
349
418
  position: relative;
350
419
  display: inline-flex;
351
420
  }
352
- .rk-menu-trigger[data-v-ee62de72] {
421
+ .rk-menu-trigger[data-v-eaeecb75] {
353
422
  display: inline-flex;
354
423
  border-radius: var(--radius-cell);
355
424
  }
356
- .rk-menu-trigger[data-v-ee62de72]:focus-visible {
425
+ .rk-menu-trigger[data-v-eaeecb75]:focus-visible {
357
426
  outline: 2px solid var(--color-primary);
358
427
  outline-offset: 2px;
359
428
  }
360
- .rk-menu-panel[data-v-ee62de72] {
429
+ .rk-menu-panel[data-v-eaeecb75] {
361
430
  position: absolute;
362
431
  top: calc(100% + 0.5rem);
363
432
  z-index: 50;
@@ -366,51 +435,51 @@
366
435
  border-radius: var(--radius-card);
367
436
  padding: 0.375rem;
368
437
  }
369
- .rk-menu-panel.is-end[data-v-ee62de72] {
370
- right: 0;
438
+ .rk-menu-panel.is-end[data-v-eaeecb75] {
439
+ inset-inline-end: 0;
371
440
  }
372
- .rk-menu-panel.is-start[data-v-ee62de72] {
373
- left: 0;
441
+ .rk-menu-panel.is-start[data-v-eaeecb75] {
442
+ inset-inline-start: 0;
374
443
  }
375
444
 
376
445
  /* The items belong to the caller, so this styles them by role rather than by
377
446
  class: whatever they render, it lines up. */
378
- .rk-menu-panel[data-v-ee62de72] [role='menuitem'] {
447
+ .rk-menu-panel[data-v-eaeecb75] [role='menuitem'] {
379
448
  display: block;
380
449
  width: 100%;
381
450
  border-radius: var(--radius-cell);
382
451
  padding: 0.5rem 0.75rem;
383
- text-align: left;
452
+ text-align: start;
384
453
  font-size: 0.875rem;
385
454
  color: var(--color-ink);
386
455
  transition: background-color var(--duration-fast);
387
456
  }
388
- .rk-menu-panel[data-v-ee62de72] [role='menuitem']:hover {
457
+ .rk-menu-panel[data-v-eaeecb75] [role='menuitem']:hover {
389
458
  background: var(--color-muted);
390
459
  }
391
- .rk-menu-panel[data-v-ee62de72] [role='menuitem']:focus-visible {
460
+ .rk-menu-panel[data-v-eaeecb75] [role='menuitem']:focus-visible {
392
461
  outline: 2px solid var(--color-primary);
393
462
  outline-offset: -2px;
394
463
  }
395
- .rk-menu-panel[data-v-ee62de72] hr {
464
+ .rk-menu-panel[data-v-eaeecb75] hr {
396
465
  margin: 0.375rem 0;
397
466
  height: 1px;
398
467
  border: 0;
399
468
  background: color-mix(in srgb, var(--color-hair) 70%, transparent);
400
469
  }
401
470
 
402
- .rk-combo[data-v-aa2335fa] {
471
+ .rk-combo[data-v-0ae3b425] {
403
472
  position: relative;
404
473
  display: flex;
405
474
  flex-direction: column;
406
475
  gap: 0.375rem;
407
476
  }
408
- .rk-combo-label[data-v-aa2335fa] {
477
+ .rk-combo-label[data-v-0ae3b425] {
409
478
  font-size: 0.875rem;
410
479
  font-weight: 500;
411
480
  color: var(--color-ink);
412
481
  }
413
- .rk-combo-field[data-v-aa2335fa] {
482
+ .rk-combo-field[data-v-0ae3b425] {
414
483
  position: relative;
415
484
  display: flex;
416
485
  align-items: center;
@@ -418,14 +487,14 @@
418
487
 
419
488
  /* With chips the field is a box that wraps, and the input is one item in it
420
489
  that grows into whatever is left. */
421
- .rk-combo-field.is-multiple[data-v-aa2335fa] {
490
+ .rk-combo-field.is-multiple[data-v-0ae3b425] {
422
491
  flex-wrap: wrap;
423
492
  gap: 0.25rem;
424
493
  min-height: 2.75rem;
425
494
  border-radius: var(--radius-card);
426
495
  padding: 0.3125rem 2rem 0.3125rem 0.375rem;
427
496
  }
428
- .rk-combo-chip[data-v-aa2335fa] {
497
+ .rk-combo-chip[data-v-0ae3b425] {
429
498
  display: inline-flex;
430
499
  align-items: center;
431
500
  gap: 0.25rem;
@@ -435,7 +504,7 @@
435
504
  font-size: 0.8125rem;
436
505
  color: var(--color-ink);
437
506
  }
438
- .rk-combo-chip-x[data-v-aa2335fa] {
507
+ .rk-combo-chip-x[data-v-0ae3b425] {
439
508
  display: grid;
440
509
  width: 1.125rem;
441
510
  height: 1.125rem;
@@ -444,13 +513,13 @@
444
513
  color: var(--color-ink-soft);
445
514
  line-height: 1;
446
515
  }
447
- .rk-combo-chip-x[data-v-aa2335fa]:hover {
516
+ .rk-combo-chip-x[data-v-0ae3b425]:hover {
448
517
  color: var(--color-ink);
449
518
  }
450
519
 
451
520
  /* 16px, like every other text control here: iOS zooms the viewport when it
452
521
  focuses a field under 16px and never zooms back. */
453
- .rk-combo-input[data-v-aa2335fa] {
522
+ .rk-combo-input[data-v-0ae3b425] {
454
523
  width: 100%;
455
524
  height: 2.75rem;
456
525
  border-radius: var(--radius-card);
@@ -458,7 +527,7 @@
458
527
  font-size: 1rem;
459
528
  color: var(--color-ink);
460
529
  }
461
- .is-multiple .rk-combo-input[data-v-aa2335fa] {
530
+ .is-multiple .rk-combo-input[data-v-0ae3b425] {
462
531
  width: auto;
463
532
  height: 1.75rem;
464
533
  min-width: 6rem;
@@ -469,29 +538,29 @@
469
538
  background: transparent;
470
539
  box-shadow: none;
471
540
  }
472
- .rk-combo-input[data-v-aa2335fa]:focus-visible {
541
+ .rk-combo-input[data-v-0ae3b425]:focus-visible {
473
542
  outline: 2px solid var(--color-primary);
474
543
  outline-offset: -1px;
475
544
  }
476
- .is-multiple .rk-combo-input[data-v-aa2335fa]:focus-visible {
545
+ .is-multiple .rk-combo-input[data-v-0ae3b425]:focus-visible {
477
546
  outline: none;
478
547
  }
479
548
 
480
549
  /* The ring belongs to the whole box once the box is the control. */
481
- .rk-combo-field.is-multiple[data-v-aa2335fa]:focus-within {
550
+ .rk-combo-field.is-multiple[data-v-0ae3b425]:focus-within {
482
551
  outline: 2px solid var(--color-primary);
483
552
  outline-offset: -1px;
484
553
  }
485
- .rk-combo-input[data-v-aa2335fa]:disabled {
554
+ .rk-combo-input[data-v-0ae3b425]:disabled {
486
555
  opacity: 0.5;
487
556
  }
488
- .rk-combo-toggle[data-v-aa2335fa] {
557
+ .rk-combo-toggle[data-v-0ae3b425] {
489
558
  position: absolute;
490
- right: 0.5rem;
559
+ inset-inline-end: 0.5rem;
491
560
  color: var(--color-ink-soft);
492
561
  font-size: 0.75rem;
493
562
  }
494
- .rk-combo-list[data-v-aa2335fa] {
563
+ .rk-combo-list[data-v-0ae3b425] {
495
564
  position: absolute;
496
565
  top: calc(100% - 1.25rem);
497
566
  z-index: 50;
@@ -501,7 +570,7 @@
501
570
  border-radius: var(--radius-card);
502
571
  padding: 0.25rem;
503
572
  }
504
- .rk-combo-option[data-v-aa2335fa] {
573
+ .rk-combo-option[data-v-0ae3b425] {
505
574
  cursor: pointer;
506
575
  border-radius: var(--radius-cell);
507
576
  padding: 0.5rem 0.625rem;
@@ -511,38 +580,38 @@
511
580
 
512
581
  /* A virtual row's height is the arithmetic the spacers are built on, so it
513
582
  cannot be left to the text inside it. */
514
- .rk-combo-option[style][data-v-aa2335fa] {
583
+ .rk-combo-option[style][data-v-0ae3b425] {
515
584
  display: flex;
516
585
  align-items: center;
517
586
  padding-block: 0;
518
587
  }
519
- .rk-combo-option.is-highlighted[data-v-aa2335fa] {
588
+ .rk-combo-option.is-highlighted[data-v-0ae3b425] {
520
589
  background: var(--color-muted);
521
590
  }
522
- .rk-combo-option.is-selected[data-v-aa2335fa] {
591
+ .rk-combo-option.is-selected[data-v-0ae3b425] {
523
592
  font-weight: 600;
524
593
  }
525
- .rk-combo-empty[data-v-aa2335fa],
526
- .rk-combo-status[data-v-aa2335fa] {
594
+ .rk-combo-empty[data-v-0ae3b425],
595
+ .rk-combo-status[data-v-0ae3b425] {
527
596
  padding: 0.75rem 0.625rem;
528
597
  font-size: 0.875rem;
529
598
  color: var(--color-ink-soft);
530
599
  }
531
- .rk-combo-status[data-v-aa2335fa] {
600
+ .rk-combo-status[data-v-0ae3b425] {
532
601
  display: flex;
533
602
  flex-direction: column;
534
603
  gap: 0.5rem;
535
604
  }
536
- .rk-combo-status-rows[data-v-aa2335fa] {
605
+ .rk-combo-status-rows[data-v-0ae3b425] {
537
606
  display: flex;
538
607
  flex-direction: column;
539
608
  gap: 0.5rem;
540
609
  }
541
- .rk-combo-error[data-v-aa2335fa] {
610
+ .rk-combo-error[data-v-0ae3b425] {
542
611
  font-size: 0.75rem;
543
612
  color: var(--color-negative);
544
613
  }
545
- .rk-combo-hint[data-v-aa2335fa] {
614
+ .rk-combo-hint[data-v-0ae3b425] {
546
615
  font-size: 0.75rem;
547
616
  color: var(--color-ink-soft);
548
617
  }
@@ -743,7 +812,7 @@ to {
743
812
  }
744
813
  }
745
814
 
746
- .rk-switch[data-v-3f4400a0] {
815
+ .rk-switch[data-v-d90e1aa6] {
747
816
  position: relative;
748
817
  display: inline-flex;
749
818
  flex-shrink: 0;
@@ -754,20 +823,20 @@ to {
754
823
  background: var(--color-hair);
755
824
  transition: background-color var(--duration-base) ease;
756
825
  }
757
- .rk-switch.is-on[data-v-3f4400a0] {
826
+ .rk-switch.is-on[data-v-d90e1aa6] {
758
827
  background: var(--color-primary);
759
828
  }
760
- .rk-switch[data-v-3f4400a0]:focus-visible {
829
+ .rk-switch[data-v-d90e1aa6]:focus-visible {
761
830
  outline: 2px solid var(--color-primary);
762
831
  outline-offset: 2px;
763
832
  }
764
- .rk-switch[data-v-3f4400a0]:disabled {
833
+ .rk-switch[data-v-d90e1aa6]:disabled {
765
834
  opacity: 0.5;
766
835
  pointer-events: none;
767
836
  }
768
- .rk-switch-knob[data-v-3f4400a0] {
837
+ .rk-switch-knob[data-v-d90e1aa6] {
769
838
  position: absolute;
770
- left: 0.1875rem;
839
+ inset-inline-start: 0.1875rem;
771
840
  width: 1.25rem;
772
841
  height: 1.25rem;
773
842
  border-radius: 9999px;
@@ -777,38 +846,37 @@ to {
777
846
  box-shadow: var(--shadow-control);
778
847
  transition: transform var(--duration-base) var(--ease-sheet);
779
848
  }
780
- .rk-switch.is-on .rk-switch-knob[data-v-3f4400a0] {
849
+ .rk-switch.is-on .rk-switch-knob[data-v-d90e1aa6] {
781
850
  transform: translateX(1.125rem);
782
851
  }
852
+
853
+ /* `translateX` has no logical form, so the one direction-dependent value in
854
+ the kit that cannot be written logically is written twice. Without this
855
+ the knob leaves the track entirely in a right-to-left layout. */
856
+ [dir='rtl'] .rk-switch.is-on .rk-switch-knob[data-v-d90e1aa6] {
857
+ transform: translateX(-1.125rem);
858
+ }
783
859
  @media (prefers-reduced-motion: reduce) {
784
- .rk-switch[data-v-3f4400a0],
785
- .rk-switch-knob[data-v-3f4400a0] {
860
+ .rk-switch[data-v-d90e1aa6],
861
+ .rk-switch-knob[data-v-d90e1aa6] {
786
862
  transition: none;
787
863
  }
788
864
  }
789
865
 
790
- .rk-table-scroll[data-v-ab10e9fa] {
791
- overflow-x: auto;
792
- }
793
- .rk-table-scroll[data-v-ab10e9fa]:focus-visible {
794
- outline: 2px solid var(--color-primary);
795
- outline-offset: 2px;
796
- border-radius: var(--radius-cell);
797
- }
798
- .rk-table[data-v-ab10e9fa] {
866
+ .rk-table[data-v-cc1197ef] {
799
867
  width: 100%;
800
868
  border-collapse: collapse;
801
869
  font-size: 0.875rem;
802
870
  }
803
- .rk-table-caption[data-v-ab10e9fa] {
871
+ .rk-table-caption[data-v-cc1197ef] {
804
872
  padding-bottom: 0.75rem;
805
- text-align: left;
873
+ text-align: start;
806
874
  font-size: 0.8125rem;
807
875
  color: var(--color-ink-soft);
808
876
  }
809
877
 
810
878
  /* Off screen rather than `display: none`, which is not announced at all. */
811
- .rk-table-caption-hidden[data-v-ab10e9fa] {
879
+ .rk-table-caption-hidden[data-v-cc1197ef] {
812
880
  position: absolute;
813
881
  width: 1px;
814
882
  height: 1px;
@@ -816,21 +884,21 @@ to {
816
884
  clip-path: inset(50%);
817
885
  white-space: nowrap;
818
886
  }
819
- .rk-table th[data-v-ab10e9fa] {
887
+ .rk-table th[data-v-cc1197ef] {
820
888
  border-bottom: 1px solid var(--color-hair);
821
889
  padding: 0.625rem 0.75rem;
822
- text-align: left;
890
+ text-align: start;
823
891
  font-weight: 500;
824
892
  color: var(--color-ink-soft);
825
893
  white-space: nowrap;
826
894
  }
827
- .rk-table td[data-v-ab10e9fa] {
895
+ .rk-table td[data-v-cc1197ef] {
828
896
  border-bottom: 1px solid color-mix(in srgb, var(--color-hair) 50%, transparent);
829
897
  padding: 0.75rem;
830
898
  color: var(--color-ink);
831
899
  vertical-align: top;
832
900
  }
833
- .rk-table tbody tr:last-child td[data-v-ab10e9fa] {
901
+ .rk-table tbody tr:last-child td[data-v-cc1197ef] {
834
902
  border-bottom: 0;
835
903
  }
836
904
 
@@ -838,23 +906,23 @@ to {
838
906
  Both the heading and the cells, and named against `.rk-table th` rather
839
907
  than on its own: a bare `.is-end` loses to it, and the column then reads as
840
908
  two columns — a heading on the left and its numbers far off to the right. */
841
- .rk-table th.is-end[data-v-ab10e9fa],
842
- .rk-table td.is-end[data-v-ab10e9fa] {
843
- text-align: right;
909
+ .rk-table th.is-end[data-v-cc1197ef],
910
+ .rk-table td.is-end[data-v-cc1197ef] {
911
+ text-align: end;
844
912
  font-variant-numeric: tabular-nums;
845
913
  }
846
- .rk-table th.is-center[data-v-ab10e9fa],
847
- .rk-table td.is-center[data-v-ab10e9fa] {
914
+ .rk-table th.is-center[data-v-cc1197ef],
915
+ .rk-table td.is-center[data-v-cc1197ef] {
848
916
  text-align: center;
849
917
  }
850
- .rk-table th.is-start[data-v-ab10e9fa],
851
- .rk-table td.is-start[data-v-ab10e9fa] {
852
- text-align: left;
918
+ .rk-table th.is-start[data-v-cc1197ef],
919
+ .rk-table td.is-start[data-v-cc1197ef] {
920
+ text-align: start;
853
921
  }
854
- .is-nowrap[data-v-ab10e9fa] {
922
+ .is-nowrap[data-v-cc1197ef] {
855
923
  white-space: nowrap;
856
924
  }
857
- .rk-table-empty[data-v-ab10e9fa] {
925
+ .rk-table-empty[data-v-cc1197ef] {
858
926
  padding: 2rem 0.75rem;
859
927
  text-align: center;
860
928
  color: var(--color-ink-soft);
@@ -1111,28 +1179,85 @@ to {
1111
1179
  outline-offset: 1px;
1112
1180
  }
1113
1181
 
1114
- .rk-stack[data-v-db629481] {
1182
+ .rk-vlist-rows[data-v-936ed40c] {
1183
+ margin: 0;
1184
+ padding: 0;
1185
+ list-style: none;
1186
+ }
1187
+ .rk-vlist-row[data-v-936ed40c] {
1188
+ box-sizing: border-box;
1189
+ overflow: hidden;
1190
+ }
1191
+
1192
+ /* Clipped rather than `display: none`: a hidden live region is not read at
1193
+ all, which is the quietest possible way for this to fail. */
1194
+ .rk-announcer[data-v-205d6703] {
1195
+ position: absolute;
1196
+ overflow: hidden;
1197
+ width: 1px;
1198
+ height: 1px;
1199
+ margin: -1px;
1200
+ padding: 0;
1201
+ border: 0;
1202
+ clip-path: inset(50%);
1203
+ white-space: nowrap;
1204
+ }
1205
+
1206
+ .rk-errsum[data-v-4a68e342] {
1207
+ border: 2px solid var(--color-negative);
1208
+ border-radius: var(--radius-card);
1209
+ padding: 0.875rem 1rem;
1210
+ }
1211
+ .rk-errsum[data-v-4a68e342]:focus-visible {
1212
+ outline: 2px solid var(--color-primary);
1213
+ outline-offset: 2px;
1214
+ }
1215
+ .rk-errsum-title[data-v-4a68e342] {
1216
+ margin: 0;
1217
+ color: var(--color-negative);
1218
+ font-size: 0.875rem;
1219
+ font-weight: 600;
1220
+ }
1221
+ .rk-errsum-list[data-v-4a68e342] {
1222
+ margin: 0.5rem 0 0;
1223
+ padding-inline-start: 1.125rem;
1224
+ color: var(--color-negative);
1225
+ font-size: 0.8125rem;
1226
+ }
1227
+ .rk-errsum-list li + li[data-v-4a68e342] {
1228
+ margin-block-start: 0.25rem;
1229
+ }
1230
+ .rk-errsum-link[data-v-4a68e342] {
1231
+ color: inherit;
1232
+ text-decoration: underline;
1233
+ }
1234
+ .rk-errsum-link[data-v-4a68e342]:focus-visible {
1235
+ outline: 2px solid var(--color-primary);
1236
+ outline-offset: 2px;
1237
+ }
1238
+
1239
+ .rk-stack[data-v-1f87913c] {
1115
1240
  display: inline-flex;
1116
1241
  align-items: center;
1117
1242
  }
1118
1243
 
1119
1244
  /* Overlapped by a third, with a ring in the page's own colour so each face
1120
1245
  keeps an edge against the one under it — on any material. */
1121
- .rk-stack-item + .rk-stack-item[data-v-db629481] {
1122
- margin-left: -0.5rem;
1246
+ .rk-stack-item + .rk-stack-item[data-v-1f87913c] {
1247
+ margin-inline-start: -0.5rem;
1123
1248
  }
1124
- .rk-stack.is-sm .rk-stack-item + .rk-stack-item[data-v-db629481] {
1125
- margin-left: -0.5rem;
1249
+ .rk-stack.is-sm .rk-stack-item + .rk-stack-item[data-v-1f87913c] {
1250
+ margin-inline-start: -0.5rem;
1126
1251
  }
1127
- .rk-stack.is-lg .rk-stack-item + .rk-stack-item[data-v-db629481] {
1128
- margin-left: -0.875rem;
1252
+ .rk-stack.is-lg .rk-stack-item + .rk-stack-item[data-v-1f87913c] {
1253
+ margin-inline-start: -0.875rem;
1129
1254
  }
1130
- .rk-stack-item[data-v-db629481] {
1255
+ .rk-stack-item[data-v-1f87913c] {
1131
1256
  display: inline-flex;
1132
1257
  border-radius: 9999px;
1133
1258
  box-shadow: 0 0 0 2px var(--color-surface);
1134
1259
  }
1135
- .rk-stack-rest[data-v-db629481] {
1260
+ .rk-stack-rest[data-v-1f87913c] {
1136
1261
  display: inline-grid;
1137
1262
  width: 2.25rem;
1138
1263
  height: 2.25rem;
@@ -1143,12 +1268,12 @@ to {
1143
1268
  color: var(--color-ink-soft);
1144
1269
  font-variant-numeric: tabular-nums;
1145
1270
  }
1146
- .rk-stack.is-sm .rk-stack-rest[data-v-db629481] {
1271
+ .rk-stack.is-sm .rk-stack-rest[data-v-1f87913c] {
1147
1272
  width: 1.75rem;
1148
1273
  height: 1.75rem;
1149
1274
  font-size: 0.6875rem;
1150
1275
  }
1151
- .rk-stack.is-lg .rk-stack-rest[data-v-db629481] {
1276
+ .rk-stack.is-lg .rk-stack-rest[data-v-1f87913c] {
1152
1277
  width: 3rem;
1153
1278
  height: 3rem;
1154
1279
  font-size: 0.8125rem;
@@ -1698,7 +1823,7 @@ to {
1698
1823
  color: var(--color-ink);
1699
1824
  }
1700
1825
 
1701
- .rk-drop-box[data-v-a42eab69] {
1826
+ .rk-drop-box[data-v-6e903baf] {
1702
1827
  display: flex;
1703
1828
  cursor: pointer;
1704
1829
  flex-direction: column;
@@ -1715,28 +1840,28 @@ to {
1715
1840
  }
1716
1841
 
1717
1842
  /* The box is a label, so the ring belongs to the input it names. */
1718
- .rk-drop-box[data-v-a42eab69]:has(input:focus-visible) {
1843
+ .rk-drop-box[data-v-6e903baf]:has(input:focus-visible) {
1719
1844
  outline: 2px solid var(--color-primary);
1720
1845
  outline-offset: 2px;
1721
1846
  }
1722
- .rk-drop-box.is-over[data-v-a42eab69] {
1847
+ .rk-drop-box.is-over[data-v-6e903baf] {
1723
1848
  border-color: var(--color-primary);
1724
1849
  background: color-mix(in oklab, var(--color-primary) 8%, transparent);
1725
1850
  }
1726
- .rk-drop-box.is-disabled[data-v-a42eab69] {
1851
+ .rk-drop-box.is-disabled[data-v-6e903baf] {
1727
1852
  cursor: not-allowed;
1728
1853
  opacity: 0.5;
1729
1854
  }
1730
- .rk-drop-label[data-v-a42eab69] {
1855
+ .rk-drop-label[data-v-6e903baf] {
1731
1856
  font-size: 0.875rem;
1732
1857
  font-weight: 500;
1733
1858
  color: var(--color-ink);
1734
1859
  }
1735
- .rk-drop-hint[data-v-a42eab69] {
1860
+ .rk-drop-hint[data-v-6e903baf] {
1736
1861
  font-size: 0.75rem;
1737
1862
  color: var(--color-ink-soft);
1738
1863
  }
1739
- .rk-drop-browse[data-v-a42eab69] {
1864
+ .rk-drop-browse[data-v-6e903baf] {
1740
1865
  margin-top: 0.25rem;
1741
1866
  border-radius: 9999px;
1742
1867
  background: var(--color-muted);
@@ -1745,18 +1870,18 @@ to {
1745
1870
  font-weight: 500;
1746
1871
  color: var(--color-ink);
1747
1872
  }
1748
- .rk-drop-error[data-v-a42eab69] {
1873
+ .rk-drop-error[data-v-6e903baf] {
1749
1874
  margin-top: 0.5rem;
1750
1875
  font-size: 0.8125rem;
1751
1876
  color: var(--color-negative);
1752
1877
  }
1753
- .rk-drop-files[data-v-a42eab69] {
1878
+ .rk-drop-files[data-v-6e903baf] {
1754
1879
  margin-top: 0.75rem;
1755
1880
  display: flex;
1756
1881
  flex-direction: column;
1757
1882
  gap: 0.375rem;
1758
1883
  }
1759
- .rk-drop-file[data-v-a42eab69] {
1884
+ .rk-drop-file[data-v-6e903baf] {
1760
1885
  display: flex;
1761
1886
  align-items: center;
1762
1887
  gap: 0.5rem;
@@ -1765,14 +1890,14 @@ to {
1765
1890
  font-size: 0.8125rem;
1766
1891
  color: var(--color-ink);
1767
1892
  }
1768
- .rk-drop-size[data-v-a42eab69] {
1769
- margin-left: auto;
1893
+ .rk-drop-size[data-v-6e903baf] {
1894
+ margin-inline-start: auto;
1770
1895
  flex-shrink: 0;
1771
1896
  font-size: 0.75rem;
1772
1897
  font-variant-numeric: tabular-nums;
1773
1898
  color: var(--color-ink-soft);
1774
1899
  }
1775
- .rk-drop-remove[data-v-a42eab69] {
1900
+ .rk-drop-remove[data-v-6e903baf] {
1776
1901
  display: grid;
1777
1902
  width: 1.5rem;
1778
1903
  height: 1.5rem;
@@ -1781,7 +1906,7 @@ to {
1781
1906
  border-radius: 9999px;
1782
1907
  color: var(--color-ink-soft);
1783
1908
  }
1784
- .rk-drop-remove[data-v-a42eab69]:hover {
1909
+ .rk-drop-remove[data-v-6e903baf]:hover {
1785
1910
  background: var(--color-muted);
1786
1911
  color: var(--color-ink);
1787
1912
  }
@@ -1821,11 +1946,11 @@ to {
1821
1946
  outline: none;
1822
1947
  }
1823
1948
 
1824
- .rk-popover[data-v-1371bff2] {
1949
+ .rk-popover[data-v-22d8f397] {
1825
1950
  position: relative;
1826
1951
  display: inline-flex;
1827
1952
  }
1828
- .rk-popover-panel[data-v-1371bff2] {
1953
+ .rk-popover-panel[data-v-22d8f397] {
1829
1954
  position: absolute;
1830
1955
  z-index: 50;
1831
1956
  min-width: 14rem;
@@ -1834,46 +1959,46 @@ to {
1834
1959
  padding: 0.75rem;
1835
1960
  translate: var(--rk-popover-shift, 0) 0;
1836
1961
  }
1837
- .rk-popover-panel[data-v-1371bff2]:focus-visible {
1962
+ .rk-popover-panel[data-v-22d8f397]:focus-visible {
1838
1963
  outline: 2px solid var(--color-primary);
1839
1964
  outline-offset: 2px;
1840
1965
  }
1841
- .rk-popover-panel.is-bottom[data-v-1371bff2] {
1966
+ .rk-popover-panel.is-bottom[data-v-22d8f397] {
1842
1967
  top: calc(100% + 0.5rem);
1843
1968
  }
1844
- .rk-popover-panel.is-top[data-v-1371bff2] {
1969
+ .rk-popover-panel.is-top[data-v-22d8f397] {
1845
1970
  bottom: calc(100% + 0.5rem);
1846
1971
  }
1847
- .rk-popover-panel.is-start[data-v-1371bff2] {
1848
- left: 0;
1972
+ .rk-popover-panel.is-start[data-v-22d8f397] {
1973
+ inset-inline-start: 0;
1849
1974
  }
1850
- .rk-popover-panel.is-end[data-v-1371bff2] {
1851
- right: 0;
1975
+ .rk-popover-panel.is-end[data-v-22d8f397] {
1976
+ inset-inline-end: 0;
1852
1977
  }
1853
- .rk-popover-panel.is-center[data-v-1371bff2] {
1978
+ .rk-popover-panel.is-center[data-v-22d8f397] {
1854
1979
  left: 50%;
1855
1980
  translate: calc(-50% + var(--rk-popover-shift, 0px)) 0;
1856
1981
  }
1857
- .rk-popover-enter-active[data-v-1371bff2],
1858
- .rk-popover-leave-active[data-v-1371bff2] {
1982
+ .rk-popover-enter-active[data-v-22d8f397],
1983
+ .rk-popover-leave-active[data-v-22d8f397] {
1859
1984
  transition:
1860
1985
  opacity var(--duration-fast) var(--ease-standard),
1861
1986
  transform var(--duration-fast) var(--ease-standard);
1862
1987
  }
1863
- .rk-popover-enter-from[data-v-1371bff2],
1864
- .rk-popover-leave-to[data-v-1371bff2] {
1988
+ .rk-popover-enter-from[data-v-22d8f397],
1989
+ .rk-popover-leave-to[data-v-22d8f397] {
1865
1990
  opacity: 0;
1866
1991
  transform: translateY(-4px) scale(0.98);
1867
1992
  }
1868
- .rk-popover-panel.is-top.rk-popover-enter-from[data-v-1371bff2],
1869
- .rk-popover-panel.is-top.rk-popover-leave-to[data-v-1371bff2] {
1993
+ .rk-popover-panel.is-top.rk-popover-enter-from[data-v-22d8f397],
1994
+ .rk-popover-panel.is-top.rk-popover-leave-to[data-v-22d8f397] {
1870
1995
  transform: translateY(4px) scale(0.98);
1871
1996
  }
1872
1997
 
1873
- .rk-time[data-v-0037adb2] {
1998
+ .rk-time[data-v-ad58b4f3] {
1874
1999
  display: block;
1875
2000
  }
1876
- .rk-time-field[data-v-0037adb2] {
2001
+ .rk-time-field[data-v-ad58b4f3] {
1877
2002
  display: flex;
1878
2003
  width: 100%;
1879
2004
  height: 2.75rem;
@@ -1881,59 +2006,59 @@ to {
1881
2006
  gap: 0.5rem;
1882
2007
  border-radius: var(--radius-card);
1883
2008
  padding: 0 0.75rem;
1884
- text-align: left;
2009
+ text-align: start;
1885
2010
  font-size: 1rem;
1886
2011
  font-variant-numeric: tabular-nums;
1887
2012
  color: var(--color-ink);
1888
2013
  }
1889
- .rk-time-field.is-empty[data-v-0037adb2] {
2014
+ .rk-time-field.is-empty[data-v-ad58b4f3] {
1890
2015
  color: var(--color-ink-soft);
1891
2016
  }
1892
- .rk-time-field.is-invalid[data-v-0037adb2] {
2017
+ .rk-time-field.is-invalid[data-v-ad58b4f3] {
1893
2018
  --surface-border-color: var(--color-negative);
1894
2019
  }
1895
- .rk-time-field[data-v-0037adb2]:disabled {
2020
+ .rk-time-field[data-v-ad58b4f3]:disabled {
1896
2021
  opacity: 0.5;
1897
2022
  }
1898
- .rk-time-columns[data-v-0037adb2] {
2023
+ .rk-time-columns[data-v-ad58b4f3] {
1899
2024
  display: grid;
1900
2025
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
1901
2026
  gap: 0.5rem;
1902
2027
  width: 14rem;
1903
2028
  }
1904
2029
 
1905
- .rk-timeline[data-v-08b15ce8] {
2030
+ .rk-timeline[data-v-8a452f82] {
1906
2031
  position: relative;
1907
2032
  display: flex;
1908
2033
  flex-direction: column;
1909
2034
  gap: 1rem;
1910
- padding-left: 1.5rem;
2035
+ padding-inline-start: 1.5rem;
1911
2036
  }
1912
2037
 
1913
2038
  /* Stops short of both ends: a line running past the first and last dots
1914
2039
  reads as a sequence that continues out of view. */
1915
- .rk-timeline-rail[data-v-08b15ce8] {
2040
+ .rk-timeline-rail[data-v-8a452f82] {
1916
2041
  position: absolute;
1917
2042
  top: 0.5rem;
1918
2043
  bottom: 0.75rem;
1919
- left: 0.25rem;
2044
+ inset-inline-start: 0.25rem;
1920
2045
  width: 1px;
1921
2046
  background: var(--color-hair);
1922
2047
  }
1923
- .rk-timeline-event[data-v-08b15ce8] {
2048
+ .rk-timeline-event[data-v-8a452f82] {
1924
2049
  position: relative;
1925
2050
  }
1926
- .rk-timeline-marker[data-v-08b15ce8] {
2051
+ .rk-timeline-marker[data-v-8a452f82] {
1927
2052
  position: absolute;
1928
2053
  top: 0.125rem;
1929
- left: -1.5rem;
2054
+ inset-inline-start: -1.5rem;
1930
2055
  display: grid;
1931
2056
  place-items: center;
1932
2057
  }
1933
2058
 
1934
2059
  /* The ring is the page's own ground, so the dot sits on the rail rather
1935
2060
  than being crossed by it. */
1936
- .rk-timeline-dot[data-v-08b15ce8] {
2061
+ .rk-timeline-dot[data-v-8a452f82] {
1937
2062
  display: grid;
1938
2063
  width: 0.625rem;
1939
2064
  height: 0.625rem;
@@ -1942,46 +2067,46 @@ to {
1942
2067
  border: 2px solid var(--color-canvas);
1943
2068
  color: var(--color-on-primary);
1944
2069
  }
1945
- .rk-timeline-time[data-v-08b15ce8] {
2070
+ .rk-timeline-time[data-v-8a452f82] {
1946
2071
  font-size: 0.75rem;
1947
2072
  font-weight: 500;
1948
2073
  font-variant-numeric: tabular-nums;
1949
2074
  color: var(--color-ink-soft);
1950
2075
  }
1951
- .rk-timeline-title[data-v-08b15ce8] {
2076
+ .rk-timeline-title[data-v-8a452f82] {
1952
2077
  margin-top: 0.125rem;
1953
2078
  font-size: 0.875rem;
1954
2079
  font-weight: 600;
1955
2080
  color: var(--color-ink);
1956
2081
  }
1957
- .rk-timeline-description[data-v-08b15ce8] {
2082
+ .rk-timeline-description[data-v-8a452f82] {
1958
2083
  margin-top: 0.125rem;
1959
2084
  font-size: 0.875rem;
1960
2085
  line-height: 1.5;
1961
2086
  color: var(--color-ink-soft);
1962
2087
  }
1963
- .rk-timeline-body[data-v-08b15ce8] {
2088
+ .rk-timeline-body[data-v-8a452f82] {
1964
2089
  margin-top: 0.5rem;
1965
2090
  }
1966
2091
 
1967
- .rk-date[data-v-154e27fb] {
2092
+ .rk-date[data-v-42390973] {
1968
2093
  display: block;
1969
2094
  }
1970
2095
 
1971
2096
  /* Wider than a popover's default: a calendar and a column of presets side by
1972
2097
  side do not fit in 24rem, and the month title wraps in two. */
1973
- .rk-date[data-v-154e27fb] .rk-popover-panel {
2098
+ .rk-date[data-v-42390973] .rk-popover-panel {
1974
2099
  max-width: min(34rem, calc(100vw - 1rem));
1975
2100
  }
1976
- .rk-date-wrap[data-v-154e27fb] {
2101
+ .rk-date-wrap[data-v-42390973] {
1977
2102
  display: flex;
1978
2103
  width: 100%;
1979
2104
  height: 2.75rem;
1980
2105
  align-items: center;
1981
2106
  border-radius: var(--radius-card);
1982
- padding-right: 0.375rem;
2107
+ padding-inline-end: 0.375rem;
1983
2108
  }
1984
- .rk-date-field[data-v-154e27fb] {
2109
+ .rk-date-field[data-v-42390973] {
1985
2110
  display: flex;
1986
2111
  min-width: 0;
1987
2112
  flex: 1;
@@ -1990,20 +2115,20 @@ to {
1990
2115
  gap: 0.5rem;
1991
2116
  border-radius: var(--radius-card);
1992
2117
  padding: 0 0.75rem;
1993
- text-align: left;
2118
+ text-align: start;
1994
2119
  font-size: 1rem;
1995
2120
  color: var(--color-ink);
1996
2121
  }
1997
- .rk-date-field.is-empty[data-v-154e27fb] {
2122
+ .rk-date-field.is-empty[data-v-42390973] {
1998
2123
  color: var(--color-ink-soft);
1999
2124
  }
2000
- .rk-date-wrap.is-invalid[data-v-154e27fb] {
2125
+ .rk-date-wrap.is-invalid[data-v-42390973] {
2001
2126
  --surface-border-color: var(--color-negative);
2002
2127
  }
2003
- .rk-date-field[data-v-154e27fb]:disabled {
2128
+ .rk-date-field[data-v-42390973]:disabled {
2004
2129
  opacity: 0.5;
2005
2130
  }
2006
- .rk-date-clear[data-v-154e27fb] {
2131
+ .rk-date-clear[data-v-42390973] {
2007
2132
  display: grid;
2008
2133
  width: 1.375rem;
2009
2134
  height: 1.375rem;
@@ -2012,59 +2137,59 @@ to {
2012
2137
  border-radius: 9999px;
2013
2138
  color: var(--color-ink-soft);
2014
2139
  }
2015
- .rk-date-clear[data-v-154e27fb]:hover {
2140
+ .rk-date-clear[data-v-42390973]:hover {
2016
2141
  background: var(--color-muted);
2017
2142
  color: var(--color-ink);
2018
2143
  }
2019
- .rk-date-clear[data-v-154e27fb]:focus-visible {
2144
+ .rk-date-clear[data-v-42390973]:focus-visible {
2020
2145
  outline: 2px solid var(--color-primary);
2021
2146
  outline-offset: 1px;
2022
2147
  }
2023
2148
 
2024
2149
  /* As wide as its contents rather than as narrow as they will go: in a flex
2025
2150
  panel the calendar shrinks, and a squeezed month title wraps in two. */
2026
- .rk-date-panel[data-v-154e27fb] {
2151
+ .rk-date-panel[data-v-42390973] {
2027
2152
  display: flex;
2028
2153
  width: max-content;
2029
2154
  max-width: 100%;
2030
2155
  gap: 0.75rem;
2031
2156
  }
2032
- .rk-date-panel[data-v-154e27fb] .rk-cal {
2157
+ .rk-date-panel[data-v-42390973] .rk-cal {
2033
2158
  width: 17rem;
2034
2159
  }
2035
- .rk-date-presets[data-v-154e27fb] {
2160
+ .rk-date-presets[data-v-42390973] {
2036
2161
  display: flex;
2037
2162
  min-width: 8rem;
2038
2163
  flex-direction: column;
2039
2164
  gap: 2px;
2040
- border-right: 1px solid var(--surface-border-color);
2041
- padding-right: 0.75rem;
2165
+ border-inline-end: 1px solid var(--surface-border-color);
2166
+ padding-inline-end: 0.75rem;
2042
2167
  }
2043
- .rk-date-preset[data-v-154e27fb] {
2168
+ .rk-date-preset[data-v-42390973] {
2044
2169
  width: 100%;
2045
2170
  border-radius: var(--radius-cell);
2046
2171
  padding: 0.375rem 0.5rem;
2047
- text-align: left;
2172
+ text-align: start;
2048
2173
  font-size: 0.8125rem;
2049
2174
  color: var(--color-ink);
2050
2175
  transition: background-color var(--duration-fast) var(--ease-standard);
2051
2176
  }
2052
- .rk-date-preset[data-v-154e27fb]:hover {
2177
+ .rk-date-preset[data-v-42390973]:hover {
2053
2178
  background: var(--color-muted);
2054
2179
  }
2055
2180
  @media (max-width: 30rem) {
2056
- .rk-date-panel[data-v-154e27fb] {
2181
+ .rk-date-panel[data-v-42390973] {
2057
2182
  flex-direction: column;
2058
2183
  }
2059
- .rk-date-presets[data-v-154e27fb] {
2184
+ .rk-date-presets[data-v-42390973] {
2060
2185
  flex-direction: row;
2061
2186
  flex-wrap: wrap;
2062
- border-right: 0;
2187
+ border-inline-end: 0;
2063
2188
  border-bottom: 1px solid var(--surface-border-color);
2064
- padding-right: 0;
2189
+ padding-inline-end: 0;
2065
2190
  padding-bottom: 0.5rem;
2066
2191
  }
2067
- .rk-date-preset[data-v-154e27fb] {
2192
+ .rk-date-preset[data-v-42390973] {
2068
2193
  width: auto;
2069
2194
  }
2070
2195
  }
@@ -2242,63 +2367,63 @@ to {
2242
2367
  }
2243
2368
  }
2244
2369
 
2245
- .rk-steps[data-v-6aa3221b] {
2370
+ .rk-steps[data-v-f7513d9a] {
2246
2371
  display: flex;
2247
2372
  gap: 0.5rem;
2248
2373
  }
2249
- .rk-steps.is-horizontal[data-v-6aa3221b] {
2374
+ .rk-steps.is-horizontal[data-v-f7513d9a] {
2250
2375
  align-items: flex-start;
2251
2376
  }
2252
- .rk-steps.is-vertical[data-v-6aa3221b] {
2377
+ .rk-steps.is-vertical[data-v-f7513d9a] {
2253
2378
  flex-direction: column;
2254
2379
  gap: 0;
2255
2380
  }
2256
- .rk-step[data-v-6aa3221b] {
2381
+ .rk-step[data-v-f7513d9a] {
2257
2382
  position: relative;
2258
2383
  flex: 1;
2259
2384
  min-width: 0;
2260
2385
  }
2261
2386
 
2262
2387
  /* The connecting line, drawn from each step to the next. */
2263
- .rk-step[data-v-6aa3221b]:not(:last-child)::after {
2388
+ .rk-step[data-v-f7513d9a]:not(:last-child)::after {
2264
2389
  content: '';
2265
2390
  position: absolute;
2266
2391
  background: var(--color-hair);
2267
2392
  transition: background-color var(--duration-base) var(--ease-standard);
2268
2393
  }
2269
- .is-horizontal .rk-step[data-v-6aa3221b]:not(:last-child)::after {
2394
+ .is-horizontal .rk-step[data-v-f7513d9a]:not(:last-child)::after {
2270
2395
  top: 0.875rem;
2271
- left: calc(1.75rem + 0.5rem);
2272
- right: 0.5rem;
2396
+ inset-inline-start: calc(1.75rem + 0.5rem);
2397
+ inset-inline-end: 0.5rem;
2273
2398
  height: 2px;
2274
2399
  }
2275
- .is-vertical .rk-step[data-v-6aa3221b]:not(:last-child)::after {
2400
+ .is-vertical .rk-step[data-v-f7513d9a]:not(:last-child)::after {
2276
2401
  top: 2.125rem;
2277
2402
  bottom: 0.25rem;
2278
- left: 0.8125rem;
2403
+ inset-inline-start: 0.8125rem;
2279
2404
  width: 2px;
2280
2405
  }
2281
- .rk-step.is-complete[data-v-6aa3221b]::after {
2406
+ .rk-step.is-complete[data-v-f7513d9a]::after {
2282
2407
  background: var(--color-primary);
2283
2408
  }
2284
- .rk-step-body[data-v-6aa3221b] {
2409
+ .rk-step-body[data-v-f7513d9a] {
2285
2410
  display: flex;
2286
2411
  align-items: flex-start;
2287
2412
  gap: 0.625rem;
2288
2413
  width: 100%;
2289
2414
  border-radius: var(--radius-cell);
2290
- text-align: left;
2415
+ text-align: start;
2291
2416
  }
2292
- .is-horizontal .rk-step-body[data-v-6aa3221b] {
2417
+ .is-horizontal .rk-step-body[data-v-f7513d9a] {
2293
2418
  flex-direction: column;
2294
2419
  }
2295
- .is-vertical .rk-step-body[data-v-6aa3221b] {
2420
+ .is-vertical .rk-step-body[data-v-f7513d9a] {
2296
2421
  padding-bottom: 1.5rem;
2297
2422
  }
2298
- .rk-step-body.is-clickable[data-v-6aa3221b] {
2423
+ .rk-step-body.is-clickable[data-v-f7513d9a] {
2299
2424
  cursor: pointer;
2300
2425
  }
2301
- .rk-step-mark[data-v-6aa3221b] {
2426
+ .rk-step-mark[data-v-f7513d9a] {
2302
2427
  position: relative;
2303
2428
  z-index: 1;
2304
2429
  display: grid;
@@ -2317,43 +2442,43 @@ to {
2317
2442
  border-color var(--duration-base) var(--ease-standard),
2318
2443
  color var(--duration-base) var(--ease-standard);
2319
2444
  }
2320
- .is-current .rk-step-mark[data-v-6aa3221b] {
2445
+ .is-current .rk-step-mark[data-v-f7513d9a] {
2321
2446
  border-color: var(--color-primary);
2322
2447
  color: var(--color-primary);
2323
2448
  }
2324
- .is-complete .rk-step-mark[data-v-6aa3221b] {
2449
+ .is-complete .rk-step-mark[data-v-f7513d9a] {
2325
2450
  border-color: var(--color-primary);
2326
2451
  background: var(--color-primary);
2327
2452
  color: var(--color-on-primary);
2328
2453
  }
2329
- .is-error .rk-step-mark[data-v-6aa3221b] {
2454
+ .is-error .rk-step-mark[data-v-f7513d9a] {
2330
2455
  border-color: var(--color-negative);
2331
2456
  background: var(--color-negative);
2332
2457
  color: var(--color-on-negative);
2333
2458
  }
2334
- .is-clickable:hover .rk-step-mark[data-v-6aa3221b] {
2459
+ .is-clickable:hover .rk-step-mark[data-v-f7513d9a] {
2335
2460
  box-shadow: 0 0 0 4px color-mix(in oklab, var(--color-primary) 18%, transparent);
2336
2461
  }
2337
- .rk-step-text[data-v-6aa3221b] {
2462
+ .rk-step-text[data-v-f7513d9a] {
2338
2463
  display: flex;
2339
2464
  min-width: 0;
2340
2465
  flex-direction: column;
2341
2466
  gap: 0.125rem;
2342
2467
  padding-top: 0.25rem;
2343
2468
  }
2344
- .rk-step-label[data-v-6aa3221b] {
2469
+ .rk-step-label[data-v-f7513d9a] {
2345
2470
  font-size: 0.8125rem;
2346
2471
  font-weight: 600;
2347
2472
  color: var(--color-ink-soft);
2348
2473
  }
2349
- .is-current .rk-step-label[data-v-6aa3221b],
2350
- .is-complete .rk-step-label[data-v-6aa3221b] {
2474
+ .is-current .rk-step-label[data-v-f7513d9a],
2475
+ .is-complete .rk-step-label[data-v-f7513d9a] {
2351
2476
  color: var(--color-ink);
2352
2477
  }
2353
- .is-error .rk-step-label[data-v-6aa3221b] {
2478
+ .is-error .rk-step-label[data-v-f7513d9a] {
2354
2479
  color: var(--color-negative);
2355
2480
  }
2356
- .rk-step-description[data-v-6aa3221b] {
2481
+ .rk-step-description[data-v-f7513d9a] {
2357
2482
  font-size: 0.75rem;
2358
2483
  line-height: 1.4;
2359
2484
  color: var(--color-ink-soft);
@@ -2419,27 +2544,27 @@ to {
2419
2544
  filter: blur(4px);
2420
2545
  }
2421
2546
 
2422
- .rk-type[data-v-05f176ab] {
2547
+ .rk-type[data-v-591b5cef] {
2423
2548
  white-space: pre-wrap;
2424
2549
  }
2425
2550
 
2426
2551
  /* A bar the height of the text, in its colour. */
2427
- .rk-type-cursor[data-v-05f176ab] {
2552
+ .rk-type-cursor[data-v-591b5cef] {
2428
2553
  display: inline-block;
2429
2554
  width: 0.08em;
2430
2555
  height: 1em;
2431
- margin-left: 0.06em;
2556
+ margin-inline-start: 0.06em;
2432
2557
  vertical-align: -0.12em;
2433
2558
  background: currentColor;
2434
- animation: rk-type-blink-05f176ab 1s steps(1) infinite;
2559
+ animation: rk-type-blink-591b5cef 1s steps(1) infinite;
2435
2560
  }
2436
- @keyframes rk-type-blink-05f176ab {
2561
+ @keyframes rk-type-blink-591b5cef {
2437
2562
  50% {
2438
2563
  opacity: 0;
2439
2564
  }
2440
2565
  }
2441
2566
  @media (prefers-reduced-motion: reduce) {
2442
- .rk-type-cursor[data-v-05f176ab] {
2567
+ .rk-type-cursor[data-v-591b5cef] {
2443
2568
  animation: none;
2444
2569
  }
2445
2570
  }
@@ -2582,13 +2707,13 @@ to {
2582
2707
  }
2583
2708
  }
2584
2709
 
2585
- .rk-accordion[data-v-03e2e1d0] {
2710
+ .rk-accordion[data-v-d558aa6a] {
2586
2711
  border-top: 1px solid color-mix(in srgb, var(--color-hair) 70%, transparent);
2587
2712
  }
2588
- .rk-accordion-item[data-v-03e2e1d0] {
2713
+ .rk-accordion-item[data-v-d558aa6a] {
2589
2714
  border-bottom: 1px solid color-mix(in srgb, var(--color-hair) 70%, transparent);
2590
2715
  }
2591
- .rk-accordion-control[data-v-03e2e1d0] {
2716
+ .rk-accordion-control[data-v-d558aa6a] {
2592
2717
  display: flex;
2593
2718
  width: 100%;
2594
2719
  cursor: pointer;
@@ -2596,22 +2721,22 @@ to {
2596
2721
  justify-content: space-between;
2597
2722
  gap: 1.5rem;
2598
2723
  padding: 1.25rem 0;
2599
- text-align: left;
2724
+ text-align: start;
2600
2725
  transition: color var(--duration-fast);
2601
2726
  }
2602
- .rk-accordion-control[data-v-03e2e1d0]:hover {
2727
+ .rk-accordion-control[data-v-d558aa6a]:hover {
2603
2728
  color: var(--color-primary);
2604
2729
  }
2605
- .rk-accordion-control[data-v-03e2e1d0]:focus-visible {
2730
+ .rk-accordion-control[data-v-d558aa6a]:focus-visible {
2606
2731
  outline: 2px solid var(--color-primary);
2607
2732
  outline-offset: 2px;
2608
2733
  }
2609
- .rk-accordion-title[data-v-03e2e1d0] {
2734
+ .rk-accordion-title[data-v-d558aa6a] {
2610
2735
  color: var(--color-ink);
2611
2736
  font-size: 1rem;
2612
2737
  font-weight: 500;
2613
2738
  }
2614
- .rk-accordion-mark[data-v-03e2e1d0] {
2739
+ .rk-accordion-mark[data-v-d558aa6a] {
2615
2740
  position: relative;
2616
2741
  display: grid;
2617
2742
  place-items: center;
@@ -2619,34 +2744,34 @@ to {
2619
2744
  width: 1.5rem;
2620
2745
  height: 1.5rem;
2621
2746
  }
2622
- .rk-accordion-bar[data-v-03e2e1d0] {
2747
+ .rk-accordion-bar[data-v-d558aa6a] {
2623
2748
  position: absolute;
2624
2749
  height: 1px;
2625
2750
  width: 0.875rem;
2626
2751
  background: var(--color-ink-soft);
2627
2752
  }
2628
- .rk-accordion-bar-turn[data-v-03e2e1d0] {
2753
+ .rk-accordion-bar-turn[data-v-d558aa6a] {
2629
2754
  transform: rotate(90deg);
2630
2755
  transition: transform var(--duration-slower) ease-out;
2631
2756
  }
2632
- .rk-accordion-bar-turn.is-open[data-v-03e2e1d0] {
2757
+ .rk-accordion-bar-turn.is-open[data-v-d558aa6a] {
2633
2758
  transform: rotate(0deg);
2634
2759
  }
2635
2760
 
2636
2761
  /* 0fr to 1fr is the whole trick: a grid row can be animated to a height that
2637
2762
  was never measured, which is what `height: auto` cannot do. */
2638
- .rk-accordion-panel[data-v-03e2e1d0] {
2763
+ .rk-accordion-panel[data-v-d558aa6a] {
2639
2764
  display: grid;
2640
2765
  grid-template-rows: 0fr;
2641
2766
  transition: grid-template-rows var(--duration-slower) ease-out;
2642
2767
  }
2643
- .rk-accordion-panel.is-open[data-v-03e2e1d0] {
2768
+ .rk-accordion-panel.is-open[data-v-d558aa6a] {
2644
2769
  grid-template-rows: 1fr;
2645
2770
  }
2646
- .rk-accordion-clip[data-v-03e2e1d0] {
2771
+ .rk-accordion-clip[data-v-d558aa6a] {
2647
2772
  overflow: hidden;
2648
2773
  }
2649
- .rk-accordion-body[data-v-03e2e1d0] {
2774
+ .rk-accordion-body[data-v-d558aa6a] {
2650
2775
  max-width: 68ch;
2651
2776
  padding-bottom: 1.5rem;
2652
2777
  color: var(--color-ink-soft);
@@ -2654,13 +2779,13 @@ to {
2654
2779
  opacity: 0;
2655
2780
  transition: opacity var(--duration-slow);
2656
2781
  }
2657
- .rk-accordion-body.is-open[data-v-03e2e1d0] {
2782
+ .rk-accordion-body.is-open[data-v-d558aa6a] {
2658
2783
  opacity: 1;
2659
2784
  }
2660
2785
  @media (prefers-reduced-motion: reduce) {
2661
- .rk-accordion-panel[data-v-03e2e1d0],
2662
- .rk-accordion-bar-turn[data-v-03e2e1d0],
2663
- .rk-accordion-body[data-v-03e2e1d0] {
2786
+ .rk-accordion-panel[data-v-d558aa6a],
2787
+ .rk-accordion-bar-turn[data-v-d558aa6a],
2788
+ .rk-accordion-body[data-v-d558aa6a] {
2664
2789
  transition: none;
2665
2790
  }
2666
2791
  }
@@ -2748,7 +2873,7 @@ to {
2748
2873
  border-block-start: 1px solid var(--color-hair);
2749
2874
  }
2750
2875
 
2751
- .rk-disclosure-control[data-v-ad5c09f5] {
2876
+ .rk-disclosure-control[data-v-f3a3f8c7] {
2752
2877
  display: flex;
2753
2878
  width: 100%;
2754
2879
  cursor: pointer;
@@ -2756,22 +2881,22 @@ to {
2756
2881
  justify-content: space-between;
2757
2882
  gap: 1.5rem;
2758
2883
  padding: 1.25rem 0;
2759
- text-align: left;
2884
+ text-align: start;
2760
2885
  transition: color var(--duration-fast);
2761
2886
  }
2762
- .rk-disclosure-control[data-v-ad5c09f5]:hover {
2887
+ .rk-disclosure-control[data-v-f3a3f8c7]:hover {
2763
2888
  color: var(--color-primary);
2764
2889
  }
2765
- .rk-disclosure-control[data-v-ad5c09f5]:focus-visible {
2890
+ .rk-disclosure-control[data-v-f3a3f8c7]:focus-visible {
2766
2891
  outline: 2px solid var(--color-primary);
2767
2892
  outline-offset: 2px;
2768
2893
  }
2769
- .rk-disclosure-title[data-v-ad5c09f5] {
2894
+ .rk-disclosure-title[data-v-f3a3f8c7] {
2770
2895
  color: var(--color-ink);
2771
2896
  font-size: 1rem;
2772
2897
  font-weight: 500;
2773
2898
  }
2774
- .rk-disclosure-mark[data-v-ad5c09f5] {
2899
+ .rk-disclosure-mark[data-v-f3a3f8c7] {
2775
2900
  position: relative;
2776
2901
  display: grid;
2777
2902
  place-items: center;
@@ -2779,34 +2904,34 @@ to {
2779
2904
  width: 1.5rem;
2780
2905
  height: 1.5rem;
2781
2906
  }
2782
- .rk-disclosure-bar[data-v-ad5c09f5] {
2907
+ .rk-disclosure-bar[data-v-f3a3f8c7] {
2783
2908
  position: absolute;
2784
2909
  height: 1px;
2785
2910
  width: 0.875rem;
2786
2911
  background: var(--color-ink-soft);
2787
2912
  }
2788
- .rk-disclosure-turn[data-v-ad5c09f5] {
2913
+ .rk-disclosure-turn[data-v-f3a3f8c7] {
2789
2914
  transform: rotate(90deg);
2790
2915
  transition: transform var(--duration-slower) ease-out;
2791
2916
  }
2792
- .rk-disclosure-turn.is-open[data-v-ad5c09f5] {
2917
+ .rk-disclosure-turn.is-open[data-v-f3a3f8c7] {
2793
2918
  transform: rotate(0deg);
2794
2919
  }
2795
2920
 
2796
2921
  /* 0fr to 1fr is the whole trick: a grid row can be animated to a height that
2797
2922
  was never measured, which `height: auto` cannot do. */
2798
- .rk-disclosure-panel[data-v-ad5c09f5] {
2923
+ .rk-disclosure-panel[data-v-f3a3f8c7] {
2799
2924
  display: grid;
2800
2925
  grid-template-rows: 0fr;
2801
2926
  transition: grid-template-rows var(--duration-slower) ease-out;
2802
2927
  }
2803
- .rk-disclosure-panel.is-open[data-v-ad5c09f5] {
2928
+ .rk-disclosure-panel.is-open[data-v-f3a3f8c7] {
2804
2929
  grid-template-rows: 1fr;
2805
2930
  }
2806
- .rk-disclosure-clip[data-v-ad5c09f5] {
2931
+ .rk-disclosure-clip[data-v-f3a3f8c7] {
2807
2932
  overflow: hidden;
2808
2933
  }
2809
- .rk-disclosure-body[data-v-ad5c09f5] {
2934
+ .rk-disclosure-body[data-v-f3a3f8c7] {
2810
2935
  max-width: 68ch;
2811
2936
  padding-bottom: 1.5rem;
2812
2937
  color: var(--color-ink-soft);
@@ -2814,13 +2939,13 @@ to {
2814
2939
  opacity: 0;
2815
2940
  transition: opacity var(--duration-slow);
2816
2941
  }
2817
- .rk-disclosure-body.is-open[data-v-ad5c09f5] {
2942
+ .rk-disclosure-body.is-open[data-v-f3a3f8c7] {
2818
2943
  opacity: 1;
2819
2944
  }
2820
2945
  @media (prefers-reduced-motion: reduce) {
2821
- .rk-disclosure-panel[data-v-ad5c09f5],
2822
- .rk-disclosure-turn[data-v-ad5c09f5],
2823
- .rk-disclosure-body[data-v-ad5c09f5] {
2946
+ .rk-disclosure-panel[data-v-f3a3f8c7],
2947
+ .rk-disclosure-turn[data-v-f3a3f8c7],
2948
+ .rk-disclosure-body[data-v-f3a3f8c7] {
2824
2949
  transition: none;
2825
2950
  }
2826
2951
  }
@@ -3150,7 +3275,7 @@ to {
3150
3275
  color: var(--color-ink-soft);
3151
3276
  }
3152
3277
 
3153
- .rk-command[data-v-f72521e7] {
3278
+ .rk-command[data-v-64849895] {
3154
3279
  position: fixed;
3155
3280
  inset: 0;
3156
3281
  z-index: 90;
@@ -3161,13 +3286,13 @@ to {
3161
3286
  grows downwards into space rather than pushing itself off both edges. */
3162
3287
  padding-top: min(12vh, 6rem);
3163
3288
  }
3164
- .rk-command-scrim[data-v-f72521e7] {
3289
+ .rk-command-scrim[data-v-64849895] {
3165
3290
  position: absolute;
3166
3291
  inset: 0;
3167
3292
  background: color-mix(in oklab, var(--color-ink) 45%, transparent);
3168
3293
  backdrop-filter: blur(2px);
3169
3294
  }
3170
- .rk-command-panel[data-v-f72521e7] {
3295
+ .rk-command-panel[data-v-64849895] {
3171
3296
  position: relative;
3172
3297
  display: flex;
3173
3298
  width: 100%;
@@ -3177,14 +3302,14 @@ to {
3177
3302
  overflow: hidden;
3178
3303
  border-radius: var(--radius-card);
3179
3304
  }
3180
- .rk-command-field[data-v-f72521e7] {
3305
+ .rk-command-field[data-v-64849895] {
3181
3306
  display: flex;
3182
3307
  align-items: center;
3183
3308
  gap: 0.625rem;
3184
3309
  border-bottom: 1px solid var(--surface-border-color);
3185
3310
  padding: 0.875rem 1rem;
3186
3311
  }
3187
- .rk-command-input[data-v-f72521e7] {
3312
+ .rk-command-input[data-v-64849895] {
3188
3313
  min-width: 0;
3189
3314
  flex: 1;
3190
3315
  background: transparent;
@@ -3196,15 +3321,15 @@ to {
3196
3321
  /* The field takes focus the moment this opens, so a full ring around it
3197
3322
  would be on the whole time. The rule under it turns instead: enough to
3198
3323
  say where the keyboard is, quiet enough to live with. */
3199
- .rk-command-field[data-v-f72521e7]:has(.rk-command-input:focus-visible) {
3324
+ .rk-command-field[data-v-64849895]:has(.rk-command-input:focus-visible) {
3200
3325
  border-bottom-color: var(--color-primary);
3201
3326
  box-shadow: inset 0 -1px 0 var(--color-primary);
3202
3327
  }
3203
- .rk-command-list[data-v-f72521e7] {
3328
+ .rk-command-list[data-v-64849895] {
3204
3329
  overflow-y: auto;
3205
3330
  padding: 0.375rem;
3206
3331
  }
3207
- .rk-command-group[data-v-f72521e7] {
3332
+ .rk-command-group[data-v-64849895] {
3208
3333
  padding: 0.5rem 0.625rem 0.25rem;
3209
3334
  font-size: 0.6875rem;
3210
3335
  font-weight: 600;
@@ -3212,7 +3337,7 @@ to {
3212
3337
  text-transform: uppercase;
3213
3338
  color: var(--color-ink-soft);
3214
3339
  }
3215
- .rk-command-item[data-v-f72521e7] {
3340
+ .rk-command-item[data-v-64849895] {
3216
3341
  display: flex;
3217
3342
  cursor: pointer;
3218
3343
  align-items: center;
@@ -3222,60 +3347,56 @@ to {
3222
3347
  font-size: 0.875rem;
3223
3348
  color: var(--color-ink);
3224
3349
  }
3225
- .rk-command-item.is-active[data-v-f72521e7] {
3350
+ .rk-command-item.is-active[data-v-64849895] {
3226
3351
  background: var(--color-muted);
3227
3352
  }
3228
- .rk-command-hint[data-v-f72521e7] {
3229
- margin-left: auto;
3353
+ .rk-command-hint[data-v-64849895] {
3354
+ margin-inline-start: auto;
3230
3355
  flex-shrink: 0;
3231
3356
  font-size: 0.75rem;
3232
3357
  color: var(--color-ink-soft);
3233
3358
  }
3234
- .rk-command-empty[data-v-f72521e7] {
3359
+ .rk-command-empty[data-v-64849895] {
3235
3360
  padding: 1.5rem 0.625rem;
3236
3361
  text-align: center;
3237
3362
  font-size: 0.875rem;
3238
3363
  color: var(--color-ink-soft);
3239
3364
  }
3240
- .rk-command-enter-active[data-v-f72521e7],
3241
- .rk-command-leave-active[data-v-f72521e7] {
3365
+ .rk-command-enter-active[data-v-64849895],
3366
+ .rk-command-leave-active[data-v-64849895] {
3242
3367
  transition: opacity var(--duration-fast) var(--ease-standard);
3243
3368
  }
3244
- .rk-command-enter-active .rk-command-panel[data-v-f72521e7],
3245
- .rk-command-leave-active .rk-command-panel[data-v-f72521e7] {
3369
+ .rk-command-enter-active .rk-command-panel[data-v-64849895],
3370
+ .rk-command-leave-active .rk-command-panel[data-v-64849895] {
3246
3371
  transition: transform var(--duration-fast) var(--ease-standard);
3247
3372
  }
3248
- .rk-command-enter-from[data-v-f72521e7],
3249
- .rk-command-leave-to[data-v-f72521e7] {
3373
+ .rk-command-enter-from[data-v-64849895],
3374
+ .rk-command-leave-to[data-v-64849895] {
3250
3375
  opacity: 0;
3251
3376
  }
3252
- .rk-command-enter-from .rk-command-panel[data-v-f72521e7],
3253
- .rk-command-leave-to .rk-command-panel[data-v-f72521e7] {
3377
+ .rk-command-enter-from .rk-command-panel[data-v-64849895],
3378
+ .rk-command-leave-to .rk-command-panel[data-v-64849895] {
3254
3379
  transform: translateY(-0.5rem) scale(0.98);
3255
3380
  }
3256
3381
 
3257
- /* The scroller is focusable: a region only a drag can reach is a region a
3258
- keyboard cannot read at all. */
3259
- .rk-data-scroll[data-v-f95c586b] {
3260
- overflow-x: auto;
3382
+ /* `ScrollArea` owns the scrolling and decides whether this is a focus
3383
+ stop: with selection or a sortable column there is already a way in for
3384
+ a keyboard, and a stop of its own would be a press for nothing. */
3385
+ .rk-data-scroll[data-v-54510109] {
3261
3386
  border-radius: var(--radius-card);
3262
3387
  }
3263
- .rk-data-scroll[data-v-f95c586b]:focus-visible {
3264
- outline: 2px solid var(--color-primary);
3265
- outline-offset: 2px;
3266
- }
3267
- .rk-data[data-v-f95c586b] {
3388
+ .rk-data[data-v-54510109] {
3268
3389
  width: 100%;
3269
3390
  border-collapse: collapse;
3270
3391
  font-size: 0.875rem;
3271
3392
  }
3272
- .rk-data-caption[data-v-f95c586b] {
3393
+ .rk-data-caption[data-v-54510109] {
3273
3394
  padding-bottom: 0.5rem;
3274
- text-align: left;
3395
+ text-align: start;
3275
3396
  font-size: 0.8125rem;
3276
3397
  color: var(--color-ink-soft);
3277
3398
  }
3278
- .rk-data-caption-hidden[data-v-f95c586b] {
3399
+ .rk-data-caption-hidden[data-v-54510109] {
3279
3400
  position: absolute;
3280
3401
  width: 1px;
3281
3402
  height: 1px;
@@ -3283,32 +3404,32 @@ to {
3283
3404
  clip-path: inset(50%);
3284
3405
  white-space: nowrap;
3285
3406
  }
3286
- .rk-data th[data-v-f95c586b] {
3407
+ .rk-data th[data-v-54510109] {
3287
3408
  border-bottom: 1px solid var(--color-hair);
3288
3409
  padding: 0.625rem 0.75rem;
3289
- text-align: left;
3410
+ text-align: start;
3290
3411
  font-size: 0.75rem;
3291
3412
  font-weight: 600;
3292
3413
  letter-spacing: 0.02em;
3293
3414
  color: var(--color-ink-soft);
3294
3415
  white-space: nowrap;
3295
3416
  }
3296
- .rk-data.is-sticky thead th[data-v-f95c586b] {
3417
+ .rk-data.is-sticky thead th[data-v-54510109] {
3297
3418
  position: sticky;
3298
3419
  top: 0;
3299
3420
  z-index: 1;
3300
3421
  background: var(--color-surface);
3301
3422
  }
3302
- .rk-data td[data-v-f95c586b] {
3423
+ .rk-data td[data-v-54510109] {
3303
3424
  border-bottom: 1px solid color-mix(in oklab, var(--color-hair) 60%, transparent);
3304
3425
  padding: 0.625rem 0.75rem;
3305
3426
  color: var(--color-ink);
3306
3427
  vertical-align: middle;
3307
3428
  }
3308
- .rk-data tbody tr:last-child td[data-v-f95c586b] {
3429
+ .rk-data tbody tr:last-child td[data-v-54510109] {
3309
3430
  border-bottom: 0;
3310
3431
  }
3311
- .rk-data tbody tr.is-chosen td[data-v-f95c586b] {
3432
+ .rk-data tbody tr.is-chosen td[data-v-54510109] {
3312
3433
  background: color-mix(in oklab, var(--color-primary) 8%, transparent);
3313
3434
  }
3314
3435
 
@@ -3316,23 +3437,23 @@ to {
3316
3437
  otherwise win: the heading stayed on the left while its numbers sat at the
3317
3438
  far edge, so one column read as two. The sort button is inline-flex, so it
3318
3439
  follows the heading's alignment and carries the arrow with it. */
3319
- .rk-data th.is-end[data-v-f95c586b],
3320
- .rk-data td.is-end[data-v-f95c586b] {
3321
- text-align: right;
3440
+ .rk-data th.is-end[data-v-54510109],
3441
+ .rk-data td.is-end[data-v-54510109] {
3442
+ text-align: end;
3322
3443
  font-variant-numeric: tabular-nums;
3323
3444
  }
3324
- .rk-data th.is-center[data-v-f95c586b],
3325
- .rk-data td.is-center[data-v-f95c586b] {
3445
+ .rk-data th.is-center[data-v-54510109],
3446
+ .rk-data td.is-center[data-v-54510109] {
3326
3447
  text-align: center;
3327
3448
  }
3328
- .rk-data th.is-start[data-v-f95c586b],
3329
- .rk-data td.is-start[data-v-f95c586b] {
3330
- text-align: left;
3449
+ .rk-data th.is-start[data-v-54510109],
3450
+ .rk-data td.is-start[data-v-54510109] {
3451
+ text-align: start;
3331
3452
  }
3332
- .is-nowrap[data-v-f95c586b] {
3453
+ .is-nowrap[data-v-54510109] {
3333
3454
  white-space: nowrap;
3334
3455
  }
3335
- .rk-data-sort[data-v-f95c586b] {
3456
+ .rk-data-sort[data-v-54510109] {
3336
3457
  display: inline-flex;
3337
3458
  align-items: center;
3338
3459
  gap: 0.25rem;
@@ -3340,19 +3461,14 @@ to {
3340
3461
  color: inherit;
3341
3462
  transition: color var(--duration-fast) var(--ease-standard);
3342
3463
  }
3343
- .rk-data-sort[data-v-f95c586b]:hover {
3464
+ .rk-data-sort[data-v-54510109]:hover {
3344
3465
  color: var(--color-ink);
3345
3466
  }
3346
- .rk-data-pick[data-v-f95c586b] {
3467
+ .rk-data-pick[data-v-54510109] {
3347
3468
  width: 2.75rem;
3348
- padding-right: 0;
3469
+ padding-inline-end: 0;
3349
3470
  }
3350
- .rk-data-box[data-v-f95c586b] {
3351
- width: 1rem;
3352
- height: 1rem;
3353
- accent-color: var(--color-primary);
3354
- }
3355
- .rk-data-empty[data-v-f95c586b] {
3471
+ .rk-data-empty[data-v-54510109] {
3356
3472
  padding: 2rem 0.75rem;
3357
3473
  text-align: center;
3358
3474
  color: var(--color-ink-soft);
@@ -3615,18 +3731,18 @@ to {
3615
3731
  }
3616
3732
  }
3617
3733
 
3618
- .rk-mega[data-v-9c8be532] {
3734
+ .rk-mega[data-v-a6df77ff] {
3619
3735
  position: relative;
3620
3736
  }
3621
- .rk-mega-bar[data-v-9c8be532] {
3737
+ .rk-mega-bar[data-v-a6df77ff] {
3622
3738
  display: flex;
3623
3739
  align-items: center;
3624
3740
  gap: 0.25rem;
3625
3741
  }
3626
- .rk-mega-item[data-v-9c8be532] {
3742
+ .rk-mega-item[data-v-a6df77ff] {
3627
3743
  position: static;
3628
3744
  }
3629
- .rk-mega-top[data-v-9c8be532] {
3745
+ .rk-mega-top[data-v-a6df77ff] {
3630
3746
  display: inline-flex;
3631
3747
  align-items: center;
3632
3748
  gap: 0.25rem;
@@ -3637,42 +3753,42 @@ to {
3637
3753
  color: var(--color-ink-soft);
3638
3754
  transition: color var(--duration-fast) var(--ease-standard);
3639
3755
  }
3640
- .rk-mega-top[data-v-9c8be532]:hover,
3641
- .rk-mega-top[aria-expanded='true'][data-v-9c8be532] {
3756
+ .rk-mega-top[data-v-a6df77ff]:hover,
3757
+ .rk-mega-top[aria-expanded='true'][data-v-a6df77ff] {
3642
3758
  color: var(--color-ink);
3643
3759
  }
3644
- .rk-mega-top.is-active[data-v-9c8be532] {
3760
+ .rk-mega-top.is-active[data-v-a6df77ff] {
3645
3761
  color: var(--color-primary);
3646
3762
  }
3647
- .rk-mega-twist[data-v-9c8be532] {
3763
+ .rk-mega-twist[data-v-a6df77ff] {
3648
3764
  width: 0.875rem;
3649
3765
  height: 0.875rem;
3650
3766
  transition: rotate var(--duration-fast) var(--ease-standard);
3651
3767
  }
3652
- .rk-mega-twist.is-open[data-v-9c8be532] {
3768
+ .rk-mega-twist.is-open[data-v-a6df77ff] {
3653
3769
  rotate: 180deg;
3654
3770
  }
3655
3771
 
3656
3772
  /* Full width of the bar rather than of the button: that is what makes it a
3657
3773
  mega menu and not a dropdown. */
3658
- .rk-mega-panel[data-v-9c8be532] {
3774
+ .rk-mega-panel[data-v-a6df77ff] {
3659
3775
  position: absolute;
3660
3776
  top: calc(100% + 0.5rem);
3661
- left: 0;
3777
+ inset-inline-start: 0;
3662
3778
  z-index: 50;
3663
3779
  width: 100%;
3664
3780
  border-radius: var(--radius-card);
3665
3781
  padding: 1.25rem;
3666
3782
  }
3667
- .rk-mega-panel[hidden][data-v-9c8be532] {
3783
+ .rk-mega-panel[hidden][data-v-a6df77ff] {
3668
3784
  display: none;
3669
3785
  }
3670
- .rk-mega-columns[data-v-9c8be532] {
3786
+ .rk-mega-columns[data-v-a6df77ff] {
3671
3787
  display: grid;
3672
3788
  grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
3673
3789
  gap: 1.5rem;
3674
3790
  }
3675
- .rk-mega-column-title[data-v-9c8be532] {
3791
+ .rk-mega-column-title[data-v-a6df77ff] {
3676
3792
  margin-bottom: 0.5rem;
3677
3793
  font-size: 0.6875rem;
3678
3794
  font-weight: 600;
@@ -3680,26 +3796,26 @@ to {
3680
3796
  text-transform: uppercase;
3681
3797
  color: var(--color-ink-soft);
3682
3798
  }
3683
- .rk-mega-links[data-v-9c8be532] {
3799
+ .rk-mega-links[data-v-a6df77ff] {
3684
3800
  display: flex;
3685
3801
  flex-direction: column;
3686
3802
  gap: 1px;
3687
3803
  }
3688
- .rk-mega-link[data-v-9c8be532] {
3804
+ .rk-mega-link[data-v-a6df77ff] {
3689
3805
  display: block;
3690
3806
  border-radius: var(--radius-cell);
3691
3807
  padding: 0.375rem 0.5rem;
3692
3808
  transition: background-color var(--duration-fast) var(--ease-standard);
3693
3809
  }
3694
- .rk-mega-link[data-v-9c8be532]:hover {
3810
+ .rk-mega-link[data-v-a6df77ff]:hover {
3695
3811
  background: var(--color-muted);
3696
3812
  }
3697
- .rk-mega-link-label[data-v-9c8be532] {
3813
+ .rk-mega-link-label[data-v-a6df77ff] {
3698
3814
  display: block;
3699
3815
  font-size: 0.875rem;
3700
3816
  color: var(--color-ink);
3701
3817
  }
3702
- .rk-mega-link-note[data-v-9c8be532] {
3818
+ .rk-mega-link-note[data-v-a6df77ff] {
3703
3819
  display: block;
3704
3820
  margin-top: 0.125rem;
3705
3821
  font-size: 0.75rem;
@@ -3710,10 +3826,10 @@ to {
3710
3826
  /* On a narrow screen the panel is the page width and the columns stack,
3711
3827
  because a four-column grid in a 390px column is four unreadable columns. */
3712
3828
  @media (max-width: 48rem) {
3713
- .rk-mega-panel[data-v-9c8be532] {
3829
+ .rk-mega-panel[data-v-a6df77ff] {
3714
3830
  padding: 1rem;
3715
3831
  }
3716
- .rk-mega-columns[data-v-9c8be532] {
3832
+ .rk-mega-columns[data-v-a6df77ff] {
3717
3833
  grid-template-columns: minmax(0, 1fr);
3718
3834
  gap: 1rem;
3719
3835
  }
@@ -3773,4 +3889,34 @@ to {
3773
3889
  transition: none;
3774
3890
  }
3775
3891
  }
3892
+
3893
+ /* Clipped rather than hidden: `display: none` and `visibility: hidden` both
3894
+ take it out of the tab order, and then it is a link nobody can reach. */
3895
+ .rk-skip[data-v-cafce238] {
3896
+ position: absolute;
3897
+ z-index: 100;
3898
+ overflow: hidden;
3899
+ width: 1px;
3900
+ height: 1px;
3901
+ clip-path: inset(50%);
3902
+ white-space: nowrap;
3903
+ }
3904
+ .rk-skip[data-v-cafce238]:focus-visible {
3905
+ inset-block-start: 0.5rem;
3906
+ inset-inline-start: 0.5rem;
3907
+ overflow: visible;
3908
+ width: auto;
3909
+ height: auto;
3910
+ padding: 0.5rem 0.875rem;
3911
+ border-radius: var(--radius-card);
3912
+ outline: 2px solid var(--color-primary);
3913
+ outline-offset: 2px;
3914
+ background: var(--color-surface);
3915
+ box-shadow: var(--shadow-overlay);
3916
+ clip-path: none;
3917
+ color: var(--color-ink);
3918
+ font-size: 0.875rem;
3919
+ font-weight: 500;
3920
+ text-decoration: none;
3921
+ }
3776
3922
  /*$vite$:1*/