@inkra/react 0.2.0 → 0.4.3

package/dist/styles.css

@@ -800,7 +800,8 @@
   z-index: 3;
   left: 0;
   top: 0;
-  display: block;
+  /* Inactive canvases may retain geometry from a previous size or direction. */
+  display: none;
   width: 100%;
   height: 100%;
   opacity: 0;
@@ -808,6 +809,7 @@
 }
 
 .inkra-field-control-hit[data-pencil-editable-ready="true"] .inkra-editable-text {
+  display: block;
   opacity: 1;
 }
 
@@ -876,6 +878,46 @@
   z-index: 3;
 }
 
+.inkra-field-control-hit--textarea[data-end-action="true"] .inkra-field-control--textarea {
+  display: grid !important;
+  grid-template-columns: minmax(0, 1fr) auto;
+}
+
+.inkra-textarea__end-action {
+  position: relative;
+  z-index: 3;
+  display: flex;
+  align-self: start;
+  align-items: center;
+  min-block-size: var(--inkra-touch-target);
+}
+
+.inkra-field-control-hit--textarea[data-end-action="true"] .inkra-textarea__footer {
+  grid-column: 1 / -1;
+}
+
+.inkra-textarea__underline {
+  position: absolute !important;
+  inset-inline: 0;
+  inset-block-end: -4px;
+  inline-size: 100%;
+  pointer-events: none;
+}
+
+.inkra-field-control-hit--textarea[data-invalid="true"] .inkra-textarea__underline {
+  color: var(--inkra-danger);
+}
+
+.inkra-field-control-hit--textarea[data-variant="underline"] .inkra-input__action-wash {
+  inset: 4px;
+  border-radius: 3px;
+}
+
+.inkra-field-control-hit--textarea[data-variant="underline"] .inkra-input__action-divider {
+  inset-block-start: 8px;
+  block-size: calc(100% - 16px);
+}
+
 .inkra-textarea__count {
   display: flex;
   align-items: center;
@@ -1195,7 +1237,8 @@
     color: ButtonText;
   }
 
-  .inkra-input-root[data-variant="underline"] .inkra-field-control {
+  .inkra-input-root[data-variant="underline"] .inkra-field-control,
+  .inkra-field-control-hit--textarea[data-variant="underline"] .inkra-field-control {
     border: 0;
   }
 
@@ -1247,6 +1290,10 @@
   gap: 0;
 }
 
+.inkra-input-number__controls .inkra-button {
+  touch-action: none;
+}
+
 .inkra-slider {
   --inkra-slider-track-size: 8px;
   --inkra-slider-thumb-size: 24px;
@@ -1449,11 +1496,23 @@
   line-height: var(--inkra-line-ui);
 }
 
-.inkra-selection-control:has(.inkra-selection-control__input:focus-visible) .inkra-selection-control__mark,
-.inkra-selection-control:has(.inkra-selection-control__input:focus-visible) .inkra-switch__track,
-.inkra-selection-control:has(.inkra-selection-control__input:focus-visible) .inkra-radio-group__segment {
-  outline: var(--inkra-focus-width) solid var(--inkra-focus);
-  outline-offset: var(--inkra-focus-offset);
+.inkra-selection-control__focus-ring {
+  --inkra-accent-strong: var(--inkra-focus);
+
+  inset: calc(-1 * var(--inkra-focus-offset));
+  opacity: 0;
+  pointer-events: none;
+  position: absolute !important;
+  z-index: 3;
+}
+
+.inkra-selection-control__focus-ring--inset {
+  inset: var(--inkra-focus-width);
+}
+
+.inkra-selection-control:has(.inkra-selection-control__input:focus-visible)
+  .inkra-selection-control__focus-ring {
+  opacity: 1;
 }
 
 .inkra-selection-control[data-disabled="true"] {
@@ -1501,6 +1560,7 @@
 
 .inkra-radio-group__mark {
   color: var(--inkra-ink);
+  position: relative;
 }
 
 .inkra-radio-group__icon {
@@ -1534,10 +1594,6 @@
   margin: 0;
 }
 
-.inkra-radio-group__frame .inkra-selection-control:has(.inkra-selection-control__input:focus-visible) .inkra-radio-group__segment {
-  outline-offset: calc(-1 * var(--inkra-focus-width));
-}
-
 .inkra-radio-group__segment {
   align-items: center;
   color: var(--inkra-ink);
@@ -1588,7 +1644,7 @@
   display: inline-flex;
   height: 32px;
   justify-content: flex-start;
-  overflow: hidden;
+  overflow: visible;
   padding-inline: 4px;
   width: 52px;
 }
@@ -1602,6 +1658,11 @@
   transition: transform var(--inkra-motion-fast) var(--inkra-ease);
 }
 
+.inkra-switch__track > .inkra-pencil-surface__ink {
+  border-radius: inherit;
+  overflow: hidden;
+}
+
 .inkra-switch[data-checked="true"] .inkra-switch__thumb {
   --inkra-switch-thumb-shift: 20px;
 
@@ -1613,6 +1674,7 @@
 }
 
 @media (prefers-reduced-motion: reduce) {
+  .inkra-selection-control__focus-ring,
   .inkra-radio-segment__surface,
   .inkra-switch__thumb {
     transition: none;
@@ -1630,11 +1692,17 @@
     z-index: auto;
   }
 
-  .inkra-selection-control__mark,
-  .inkra-switch__track,
-  .inkra-radio-segment__surface {
+  .inkra-selection-control .inkra-selection-control__mark,
+  .inkra-selection-control .inkra-switch__track,
+  .inkra-selection-control .inkra-radio-segment__surface,
+  .inkra-selection-control .inkra-selection-control__focus-ring {
     display: none;
   }
+
+  .inkra-selection-control__input:focus-visible {
+    outline: var(--inkra-focus-width) solid Highlight;
+    outline-offset: var(--inkra-focus-offset);
+  }
 }
 
 .inkra-portal-theme-bridge {
@@ -1643,7 +1711,7 @@
 }
 
 .inkra-overlay__backdrop {
-  animation: inkra-overlay-backdrop-in var(--inkra-motion-normal) var(--inkra-ease);
+  animation: inkra-overlay-backdrop-in var(--inkra-motion-normal) var(--inkra-ease) both;
   background: var(--inkra-overlay);
   inset: 0;
   position: fixed;
@@ -1651,13 +1719,13 @@
 }
 
 .inkra-overlay__backdrop[data-state="closed"] {
-  animation: inkra-overlay-backdrop-out var(--inkra-motion-normal) var(--inkra-ease);
+  animation: inkra-overlay-backdrop-out var(--inkra-motion-normal) var(--inkra-ease) both;
 }
 
 .inkra-overlay__content {
-  animation: inkra-overlay-content-in var(--inkra-motion-normal) var(--inkra-ease);
+  animation: inkra-overlay-content-in var(--inkra-motion-normal) var(--inkra-ease) both;
   inset-block-start: 50%;
-  inset-inline-start: 50%;
+  left: 50%;
   max-height: min(80vh, calc(100dvh - var(--inkra-space-8)));
   outline: 0;
   position: fixed;
@@ -1667,7 +1735,8 @@
 }
 
 .inkra-overlay__content[data-state="closed"] {
-  animation: inkra-overlay-content-out var(--inkra-motion-normal) var(--inkra-ease);
+  animation: inkra-overlay-content-out var(--inkra-motion-normal) var(--inkra-ease) both;
+  pointer-events: none;
 }
 
 .inkra-overlay__content:focus-visible,
@@ -1765,9 +1834,9 @@
 }
 
 .inkra-popover__content {
-  animation: inkra-popover-content-in var(--inkra-motion-normal) var(--inkra-ease);
-  max-height: min(70vh, var(--radix-popover-content-available-height, 70vh));
-  max-width: min(24rem, calc(100vw - var(--inkra-space-8)));
+  animation: inkra-popover-content-in var(--inkra-motion-normal) var(--inkra-ease) both;
+  max-height: min(70dvh, var(--radix-popover-content-available-height, 70dvh));
+  max-width: min(24rem, var(--radix-popover-content-available-width, calc(100dvw - var(--inkra-space-6))));
   outline: 0;
   transform-origin: var(--radix-popover-content-transform-origin);
   width: max-content;
@@ -1775,7 +1844,8 @@
 }
 
 .inkra-popover__content[data-state="closed"] {
-  animation: inkra-popover-content-out var(--inkra-motion-normal) var(--inkra-ease);
+  animation: inkra-popover-content-out var(--inkra-motion-normal) var(--inkra-ease) both;
+  pointer-events: none;
 }
 
 .inkra-popover__surface {
@@ -1783,6 +1853,7 @@
   display: block;
   max-height: inherit;
   max-width: inherit;
+  min-width: 0;
 }
 
 .inkra-popover__content-body {
@@ -1790,11 +1861,18 @@
   max-height: inherit;
   max-width: inherit;
   overflow: auto;
+  overflow-wrap: anywhere;
   overscroll-behavior: contain;
   padding: var(--inkra-space-4);
   scrollbar-gutter: stable;
 }
 
+.inkra-popover__title,
+.inkra-popover__description {
+  max-width: 100%;
+  overflow-wrap: anywhere;
+}
+
 .inkra-popover__arrow {
   color: var(--inkra-paper);
   fill: currentcolor;
@@ -1871,7 +1949,7 @@
   .inkra-overlay__backdrop,
   .inkra-overlay__content,
   .inkra-popover__content {
-    animation: none;
+    animation: none !important;
   }
 }
 
@@ -1903,7 +1981,7 @@
 
   .inkra-overlay__content,
   .inkra-popover__content {
-    animation: none;
+    animation: none !important;
     max-height: none;
     max-width: none;
     position: static;
@@ -1912,11 +1990,48 @@
   }
 }
 
-.inkra-search-select { width: 100%; min-width: 0; }
-.inkra-search-select__anchor { display: flex; align-items: center; gap: 4px; min-width: 0; }
-.inkra-search-select__anchor > .inkra-input-root,
-.inkra-search-select__trigger { flex: 1; min-width: 0; }
-.inkra-search-select__anchor > button:not(.inkra-search-select__trigger) { flex: none; }
+.inkra-search-select {
+  --inkra-search-select-control-height: var(--inkra-control-md);
+  --inkra-field-control-height: var(--inkra-search-select-control-height);
+
+  min-height: var(--inkra-touch-target);
+  min-width: 0;
+  width: 100%;
+}
+.inkra-search-select[data-size="sm"] { --inkra-search-select-control-height: var(--inkra-control-sm); }
+.inkra-search-select[data-size="lg"] { --inkra-search-select-control-height: var(--inkra-control-lg); }
+.inkra-search-select__anchor {
+  align-items: center;
+  block-size: var(--inkra-search-select-control-height);
+  display: flex;
+  gap: 0;
+  min-width: 0;
+  overflow: visible;
+  width: 100%;
+}
+.inkra-search-select__input,
+.inkra-search-select__trigger { flex: 1 1 auto; min-width: 0; width: auto; }
+.inkra-search-select__input .inkra-search-select__input-control > .inkra-pencil-surface__ink,
+.inkra-search-select__input .inkra-search-select__input-control > .inkra-pencil-surface__border { display: none; }
+.inkra-search-select__anchor > .inkra-input__end-action { flex: 0 0 auto; }
+.inkra-search-select__anchor > .inkra-input__end-action:has(.inkra-search-select__clear:not([data-visible])) {
+  pointer-events: none;
+}
+.inkra-search-select__anchor > .inkra-input__end-action:has(.inkra-search-select__clear:not([data-visible]))
+  > :is(.inkra-input__action-divider, .inkra-input__action-wash) { display: none; }
+.inkra-search-select__clear:not([data-visible]) { visibility: hidden; }
+.inkra-search-select__trigger .inkra-button__content,
+.inkra-search-select__trigger .inkra-button__label,
+.inkra-search-select__trigger .inkra-button__label > span { min-width: 0; width: 100%; }
+.inkra-search-select__trigger .inkra-button__label > span { gap: var(--inkra-space-2); }
+.inkra-search-select__trigger .inkra-pencil-text { flex: 1 1 auto; min-width: 0; text-align: start; }
+.inkra-search-select__trigger .inkra-pencil-icon { flex: none; }
+.inkra-search-select__control:focus-within > .inkra-pencil-surface__ink,
+.inkra-search-select__control:focus-within > .inkra-pencil-surface__border {
+  filter: contrast(1.28) saturate(1.08);
+}
+.inkra-search-select[data-disabled] .inkra-search-select__control { opacity: 0.55; }
+.inkra-search-select[data-disabled] :is(.inkra-input-root, .inkra-button) { opacity: 1; }
 .inkra-search-select__summary { display: block; margin-top: 8px; font-size: var(--inkra-text-sm); }
 .inkra-search-select__positioner { width: var(--anchor-width); max-width: calc(100vw - 16px); }
 .inkra-search-select__popup { outline: 0; width: 100%; }
@@ -1927,6 +2042,95 @@
 .inkra-search-select__popup [data-highlighted] .inkra-select__item-surface { color: var(--inkra-selection-foreground); }
 .inkra-search-select__popup [data-disabled] { opacity: 0.5; }
 
+.inkra-select-stepper {
+  inline-size: 20rem;
+  max-inline-size: 100%;
+  vertical-align: middle;
+}
+
+.inkra-select-stepper[data-full-width="true"] {
+  display: flex;
+  inline-size: 100%;
+}
+
+.inkra-select-stepper .inkra-select-stepper__control,
+.inkra-select-stepper .inkra-select-stepper__control > .inkra-pencil-surface__content {
+  flex-wrap: nowrap;
+  gap: 0;
+  padding-inline: 0;
+}
+
+.inkra-select-stepper__control {
+  outline: 0;
+}
+
+.inkra-select-stepper__value {
+  align-items: center;
+  appearance: none;
+  align-self: stretch;
+  background: transparent;
+  border: 0;
+  box-sizing: border-box;
+  color: var(--inkra-ink);
+  cursor: default;
+  display: flex;
+  flex: 1 1 auto;
+  font-family: var(--inkra-font-body);
+  font-size: var(--inkra-field-control-font-size);
+  justify-content: center;
+  line-height: var(--inkra-line-ui);
+  min-inline-size: 0;
+  overflow: hidden;
+  padding-inline: var(--inkra-field-control-padding);
+  text-align: center;
+}
+
+.inkra-select-stepper__value:focus-visible {
+  outline: 0;
+}
+
+.inkra-select-stepper__value[data-placeholder="true"] {
+  color: var(--inkra-ink-subtle);
+}
+
+.inkra-select-stepper__value .inkra-pencil-text {
+  max-inline-size: 100%;
+}
+
+.inkra-select-stepper__button .inkra-pencil-icon {
+  transition: transform var(--inkra-motion-fast) var(--inkra-ease);
+}
+
+.inkra-select-stepper:dir(rtl) .inkra-select-stepper__button .inkra-pencil-icon {
+  transform: scaleX(-1);
+}
+
+.inkra-select-stepper__native {
+  block-size: 1px;
+  clip-path: inset(50%);
+  inline-size: 1px;
+  inset: 50%;
+  overflow: hidden;
+  position: absolute;
+  white-space: nowrap;
+}
+
+@media (forced-colors: active) {
+  .inkra-search-select__control {
+    background: Canvas;
+    border: 1px solid CanvasText;
+  }
+
+  .inkra-search-select[data-invalid] .inkra-search-select__control {
+    border-color: Mark;
+  }
+
+  .inkra-select-stepper__value:focus-visible {
+    outline: var(--inkra-focus-width) solid Highlight;
+    outline-offset: calc(-1 * var(--inkra-focus-width));
+  }
+}
+
 .inkra-select__trigger {
   --inkra-select-height: var(--inkra-control-md);
   --inkra-select-font-size: var(--inkra-text-md);
@@ -2298,6 +2502,7 @@
 
   .inkra-select__trigger-icon,
   .inkra-select__focus-ring,
+  .inkra-select-stepper__button .inkra-pencil-icon,
   .inkra-select__item-surface > .inkra-pencil-surface__ink {
     transition-duration: 0ms;
   }
@@ -2346,7 +2551,14 @@
 .inkra-tabs { min-width: 0; --inkra-tabs-font-size: var(--inkra-text-md); --inkra-tabs-padding: var(--inkra-space-3); --inkra-tabs-icon-size: 20px; }
 .inkra-tabs[data-size="sm"] { --inkra-tabs-font-size: var(--inkra-text-sm); --inkra-tabs-padding: var(--inkra-space-2); --inkra-tabs-icon-size: 16px; }
 .inkra-tabs[data-size="lg"] { --inkra-tabs-font-size: 17px; --inkra-tabs-padding: var(--inkra-space-4); --inkra-tabs-icon-size: 24px; }
-.inkra-tabs__list { display: flex; gap: var(--inkra-space-2); max-width: 100%; overflow-x: auto; }
+.inkra-tabs__list {
+  display: flex;
+  gap: var(--inkra-space-2);
+  max-width: 100%;
+  overflow-x: auto;
+  overflow-y: hidden;
+  scroll-padding-inline: var(--inkra-focus-offset);
+}
 .inkra-tabs__list[data-orientation="vertical"] { flex-direction: column; }
 .inkra-tabs__list[data-divided] { gap: 24px; }
 .inkra-tabs__divider { position: absolute; color: var(--inkra-ink-muted); opacity: 0.56; }
@@ -2372,49 +2584,70 @@
 .inkra-tabs__trigger[data-state="active"] { color: var(--inkra-selection-foreground); }
 .inkra-tabs__trigger:disabled { cursor: not-allowed; opacity: 0.55; }
 .inkra-tabs__trigger:focus-visible { outline: 0; }
-.inkra-tabs__focus-ring {
+.inkra-pencil-surface.inkra-tabs__focus-ring {
   --inkra-accent-strong: var(--inkra-focus);
   position: absolute !important;
   display: block !important;
-  inset: 0;
+  inset: var(--inkra-focus-width);
   pointer-events: none;
   opacity: 0;
   z-index: 2;
 }
-.inkra-tabs__trigger:focus-visible > .inkra-tabs__focus-ring { opacity: 1; }
+.inkra-tabs__trigger:focus-visible > .inkra-pencil-surface.inkra-tabs__focus-ring { opacity: 1; }
 .inkra-tabs__content:focus-visible {
   outline: var(--inkra-focus-width) solid var(--inkra-focus);
   outline-offset: calc(-1 * var(--inkra-focus-width));
 }
-.inkra-tabs__selection { position: absolute; inset: 0; pointer-events: none; opacity: 0; }
-.inkra-tabs__trigger[data-state="active"] > .inkra-tabs__selection { opacity: 1; }
+.inkra-pencil-surface.inkra-tabs__selection { position: absolute; inset: 0; pointer-events: none; opacity: 0; }
+.inkra-tabs__trigger[data-state="active"] > .inkra-pencil-surface.inkra-tabs__selection { opacity: 1; }
 .inkra-tabs__label { position: relative; }
 .inkra-tabs__content { min-width: 0; }
 .inkra-tabs__content[hidden] { display: none !important; }
+.inkra-tabs__overflow { display: flex; align-items: center; min-width: 0; max-width: 100%; position: relative; }
+.inkra-tabs__overflow > .inkra-tabs__list { flex: 1 1 auto; min-width: 0; }
+.inkra-tabs__scroll-button, .inkra-tabs__more { flex: 0 0 44px; }
+.inkra-tabs__overflow-icon { display: inline-flex; width: 32px; height: 32px; position: relative; pointer-events: none; }
+.inkra-tabs__overflow-icon[data-down] { transform: rotate(90deg); }
+.inkra-tabs__overflow-icon > svg { position: absolute; inset: 0; width: 100%; height: 100%; }
+.inkra-tabs__overflow-icon > [data-pencil-icon-ready] + svg { display: none; }
+.inkra-tabs__overflow-icon > canvas:not([data-pencil-icon-ready]) { visibility: hidden; }
+.inkra-tabs__list[data-overflow="menu"] { position: relative; overflow: hidden; }
+.inkra-tabs__list[data-overflow="menu"][data-full-width] > .inkra-tabs__trigger { flex: 1 0 auto; }
+.inkra-tabs__trigger[data-overflow-hidden] { position: absolute; visibility: hidden; pointer-events: none; inset-inline-start: 0; top: 0; }
+.inkra-tabs__list[data-overflow="buttons"] { scrollbar-width: none; }
+.inkra-tabs__list[data-overflow="buttons"]::-webkit-scrollbar { display: none; }
 @media (forced-colors: active) {
-  .inkra-tabs__focus-ring { display: none !important; }
+  .inkra-tabs__overflow-icon > [data-pencil-icon-ready] + svg { display: block; }
+  .inkra-pencil-surface.inkra-tabs__focus-ring { display: none !important; }
   .inkra-tabs__trigger:focus-visible { outline: var(--inkra-focus-width) solid Highlight; outline-offset: calc(-1 * var(--inkra-focus-width)); }
-  .inkra-tabs__selection { display: none; }
+  .inkra-pencil-surface.inkra-tabs__selection { display: none !important; }
   .inkra-tabs__trigger[data-state="active"] { color: Highlight; outline: 2px solid Highlight; outline-offset: -2px; }
 }
-@media print { .inkra-tabs__selection, .inkra-tabs__focus-ring { display: none !important; } }
+@media print {
+  .inkra-pencil-surface.inkra-tabs__selection, .inkra-pencil-surface.inkra-tabs__focus-ring { display: none !important; }
+  .inkra-tabs__overflow-icon > [data-pencil-icon-ready] + svg { display: block; }
+}
 
 .inkra-tooltip__content {
-  animation: inkra-tooltip-content-in var(--inkra-motion-fast) var(--inkra-ease);
-  max-width: min(20rem, calc(100vw - var(--inkra-space-4)));
+  animation: inkra-tooltip-content-in var(--inkra-motion-fast) var(--inkra-ease) both;
+  max-height: min(50dvh, var(--radix-tooltip-content-available-height, 50dvh));
+  max-width: min(20rem, var(--radix-tooltip-content-available-width, calc(100dvw - var(--inkra-space-4))));
   outline: 0;
   transform-origin: var(--radix-tooltip-content-transform-origin);
   z-index: calc(var(--inkra-z-tooltip, 40) + var(--inkra-floating-layer-offset, 0));
 }
 
 .inkra-tooltip__content[data-state="closed"] {
-  animation: inkra-tooltip-content-out var(--inkra-motion-fast) var(--inkra-ease);
+  animation: inkra-tooltip-content-out var(--inkra-motion-fast) var(--inkra-ease) both;
+  pointer-events: none;
 }
 
 .inkra-tooltip__surface {
   color: var(--inkra-ink);
   display: block;
+  max-height: inherit;
   max-width: inherit;
+  min-width: 0;
 }
 
 .inkra-tooltip__content-body {
@@ -2422,9 +2655,13 @@
   font-family: var(--inkra-font-body);
   font-size: var(--inkra-text-sm);
   line-height: var(--inkra-line-ui);
+  max-height: inherit;
   max-width: inherit;
+  overflow: auto;
   overflow-wrap: anywhere;
+  overscroll-behavior: contain;
   padding: var(--inkra-space-2) var(--inkra-space-3);
+  scrollbar-gutter: stable;
   user-select: text;
 }
 
@@ -2452,7 +2689,7 @@
 
 @media (prefers-reduced-motion: reduce) {
   .inkra-tooltip__content {
-    animation: none;
+    animation: none !important;
   }
 }
 
@@ -2534,7 +2771,7 @@
   --inkra-accent-strong: var(--inkra-focus);
 
   display: block !important;
-  inset: calc(-1 * var(--inkra-focus-offset));
+  inset: var(--inkra-focus-width);
   opacity: 0;
   pointer-events: none;
   position: absolute !important;
@@ -2581,7 +2818,8 @@
 }
 
 .inkra-accordion__content[data-state="closed"] {
-  animation: inkra-accordion-content-up var(--inkra-motion-normal) var(--inkra-ease);
+  animation: inkra-accordion-content-up var(--inkra-motion-normal) var(--inkra-ease) both;
+  height: 0;
 }
 
 .inkra-accordion__content-body {
@@ -2593,6 +2831,29 @@
   padding: var(--inkra-space-2) var(--inkra-space-3) var(--inkra-space-4);
 }
 
+.inkra-accordion__content[data-state="open"] > .inkra-accordion__content-body {
+  animation: inkra-accordion-body-in var(--inkra-motion-normal) var(--inkra-ease);
+}
+
+.inkra-accordion__content[data-state="closed"] > .inkra-accordion__content-body {
+  animation: inkra-accordion-body-out var(--inkra-motion-normal) var(--inkra-ease) both;
+  pointer-events: none;
+}
+
+.inkra-accordion__content-body.inkra-accordion__content[data-state="closed"] {
+  padding: 0;
+}
+
+@keyframes inkra-accordion-body-in {
+  from { opacity: 0; transform: translateY(calc(-1 * var(--inkra-space-1))); }
+  to { opacity: 1; transform: translateY(0); }
+}
+
+@keyframes inkra-accordion-body-out {
+  from { opacity: 1; transform: translateY(0); }
+  to { opacity: 0; transform: translateY(calc(-1 * var(--inkra-space-1))); }
+}
+
 .inkra-accordion__divider {
   color: var(--inkra-border);
   inset-block-end: -4px;
@@ -2633,10 +2894,13 @@
 
 .inkra-accordion[data-orientation="horizontal"] .inkra-accordion__content[data-state="closed"] {
   animation-name: inkra-accordion-content-close-horizontal;
+  height: auto;
+  width: 0;
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .inkra-accordion__content {
+  .inkra-accordion__content,
+  .inkra-accordion__content-body {
     animation: none !important;
   }
 
@@ -2647,13 +2911,13 @@
 }
 
 @media (forced-colors: active) {
-  .inkra-accordion__focus-ring {
+  .inkra-pencil-surface.inkra-accordion__focus-ring {
     display: none !important;
   }
 
   .inkra-accordion__trigger:focus-visible {
     outline: var(--inkra-focus-width) solid Highlight;
-    outline-offset: var(--inkra-focus-offset);
+    outline-offset: calc(-1 * var(--inkra-focus-width));
   }
 
   .inkra-accordion__trigger-icon::before {
@@ -2666,8 +2930,9 @@
 }
 
 @media print {
-  .inkra-accordion__content {
-    animation: none;
+  .inkra-accordion__content,
+  .inkra-accordion__content-body {
+    animation: none !important;
   }
 }
 
@@ -2711,11 +2976,24 @@
 }
 
 .inkra-skeleton {
+  --inkra-selection-pigment: var(--inkra-ink-muted);
   block-size: 16px;
   inline-size: 100%;
   max-inline-size: 100%;
   min-inline-size: 8px;
 }
+.inkra-skeleton[data-pencil-fallback="true"] {
+  background: color-mix(in srgb, var(--inkra-ink-muted) 18%, transparent);
+  border: 0;
+}
+.inkra-skeleton[data-animation="pulse"] { animation: inkra-skeleton-pulse calc(var(--inkra-motion-slow) * 4) var(--inkra-ease) infinite; }
+@keyframes inkra-skeleton-pulse {
+  0%, 100% { opacity: 1; }
+  50% { opacity: .45; }
+}
+@media (prefers-reduced-motion: reduce), (forced-colors: active), print {
+  .inkra-skeleton[data-animation="pulse"] { animation: none; }
+}
 
 .inkra-progress {
   display: grid;
@@ -2943,11 +3221,18 @@
   .inkra-progress__segment-outline { border: 1px solid CanvasText; }
   .inkra-progress__segment-fill { background: Highlight; border: 0; }
 
-  .inkra-skeleton {
-    outline: 1px solid CanvasText;
+  .inkra-skeleton.inkra-pencil-surface {
+    background: CanvasText;
+    border: 0;
+    forced-color-adjust: none;
+    opacity: .18;
   }
 }
 
+@media print {
+  .inkra-skeleton.inkra-pencil-surface { background: color-mix(in srgb, currentColor 18%, transparent); border: 0; }
+}
+
 @media print {
   .inkra-progress__ring-ink[data-ready="true"] { visibility: hidden; }
   .inkra-progress__ring-ink[data-ready="true"] + .inkra-progress__ring-fallback { visibility: visible; }
@@ -2989,6 +3274,8 @@
 .inkra-alert__icon { display: inline-flex; width: 20px; height: 20px; flex: none; }
 .inkra-alert__icon > * { width: 100%; height: 100%; }
 .inkra-alert__body { display: grid; gap: var(--inkra-space-2); min-width: 0; overflow-wrap: anywhere; }
+.inkra-alert:has(> .inkra-alert__close) .inkra-alert__body { flex: 1; }
+.inkra-alert__close { flex: none; align-self: flex-start; }
 .inkra-alert__title { margin: 0; font-size: 17px; line-height: var(--inkra-line-ui); }
 .inkra-alert__description { font-size: var(--inkra-text-md); line-height: var(--inkra-line-body); }
 .inkra-avatar { position: relative; display: inline-flex; width: 44px; height: 44px; flex: none; isolation: isolate; }
@@ -3034,20 +3321,73 @@
   .inkra-table tr[data-selected] { outline: 1px solid Highlight; }
 }
 
-.inkra-menu { min-width: 180px; max-width: min(320px, calc(100vw - 16px)); outline: 0; z-index: calc(40 + var(--inkra-floating-layer-offset, 0)); }
-.inkra-menu__paper { padding: 4px; max-height: var(--radix-dropdown-menu-content-available-height); overflow-y: auto; }
+.inkra-menu {
+  --inkra-menu-enter-x: 0px;
+  --inkra-menu-enter-y: var(--inkra-space-1);
+  min-width: min(180px, var(--radix-dropdown-menu-content-available-width, calc(100vw - 16px)));
+  max-width: min(320px, var(--radix-dropdown-menu-content-available-width, calc(100vw - 16px)), calc(100vw - 16px));
+  outline: 0;
+  transform-origin: var(--radix-dropdown-menu-content-transform-origin);
+  z-index: calc(40 + var(--inkra-floating-layer-offset, 0));
+}
+.inkra-menu[data-side="top"] { --inkra-menu-enter-y: calc(-1 * var(--inkra-space-1)); }
+.inkra-menu[data-side="left"] { --inkra-menu-enter-x: calc(-1 * var(--inkra-space-1)); --inkra-menu-enter-y: 0px; }
+.inkra-menu[data-side="right"] { --inkra-menu-enter-x: var(--inkra-space-1); --inkra-menu-enter-y: 0px; }
+.inkra-menu[data-state="open"] { animation: inkra-menu-enter var(--inkra-motion-normal) var(--inkra-ease) both; }
+.inkra-menu[data-state="closed"] { animation: inkra-menu-exit var(--inkra-motion-fast) var(--inkra-ease) both; pointer-events: none; }
+.inkra-menu__paper {
+  box-sizing: border-box;
+  max-height: min(var(--radix-dropdown-menu-content-available-height, calc(100dvh - 16px)), calc(100dvh - 16px));
+  max-width: 100%;
+  overflow-x: hidden;
+  overflow-y: auto;
+  overscroll-behavior: contain;
+  padding: 4px;
+  scrollbar-gutter: stable;
+}
 .inkra-menu__item { position: relative; display: flex; align-items: center; gap: 8px; padding: 8px 12px; min-height: 44px; box-sizing: border-box; color: var(--inkra-ink); outline: 0; cursor: default; font-family: var(--inkra-font-body); font-size: var(--inkra-text-md); line-height: var(--inkra-line-ui); }
 .inkra-menu__item[data-destructive] { color: var(--inkra-danger-foreground); }
 .inkra-menu__item[data-disabled] { opacity: 0.5; pointer-events: none; }
-.inkra-menu__highlight { position: absolute; inset: 0; opacity: 0; pointer-events: none; }
+.inkra-menu__highlight { position: absolute; inset: 0; opacity: 0; pointer-events: none; transition: opacity var(--inkra-motion-fast) var(--inkra-ease); }
 .inkra-menu__item[data-highlighted] > .inkra-menu__highlight { opacity: 1; }
 .inkra-menu__icon { display: inline-flex; width: 16px; height: 16px; flex: none; position: relative; }
-.inkra-menu__label { position: relative; min-width: 0; overflow-wrap: anywhere; }
+.inkra-menu__label { flex: 1 1 auto; position: relative; min-width: 0; overflow-wrap: anywhere; }
+.inkra-menu__label > .inkra-pencil-text { min-width: 0; overflow-wrap: anywhere; width: 100%; }
 .inkra-menu__group-label { padding: 8px 12px; color: var(--inkra-ink-muted); font-size: var(--inkra-text-sm); }
 .inkra-menu__separator { height: 8px; }
+
+@keyframes inkra-menu-enter {
+  from { opacity: 0; transform: translate(var(--inkra-menu-enter-x), var(--inkra-menu-enter-y)); }
+  to { opacity: 1; transform: translate(0, 0); }
+}
+
+@keyframes inkra-menu-exit {
+  from { opacity: 1; transform: translate(0, 0); }
+  to { opacity: 0; transform: translate(var(--inkra-menu-enter-x), var(--inkra-menu-enter-y)); }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .inkra-menu { animation: none !important; }
+  .inkra-menu__highlight { transition: none; }
+}
+
+@media print {
+  .inkra-menu { animation: none !important; }
+}
 @media (forced-colors: active) {
   .inkra-menu { border: 1px solid CanvasText; background: Canvas; }
-  .inkra-menu__item[data-highlighted] { outline: 2px solid Highlight; outline-offset: -2px; }
+  .inkra-menu__highlight { display: none !important; }
+  .inkra-menu__item[data-highlighted] {
+    background: Highlight;
+    color: HighlightText;
+    forced-color-adjust: none;
+    outline: 2px solid Highlight;
+    outline-offset: -2px;
+  }
+  .inkra-menu__item[data-disabled] { color: GrayText; opacity: 1; }
+  .inkra-menu__icon .inkra-pencil-icon { display: none !important; }
+  .inkra-menu__item[data-state="checked"] .inkra-menu__icon::after { content: "✓"; }
+  .inkra-menu__item[data-state="indeterminate"] .inkra-menu__icon::after { content: "—"; }
 }
 
 .inkra-slot {
@@ -3161,15 +3501,22 @@
 }
 
 .inkra-log {
+  box-sizing: border-box;
   color: var(--inkra-ink);
+  container-type: inline-size;
   display: grid;
-  grid-template-rows: minmax(0, 1fr);
+  grid-template-columns: minmax(0, 1fr);
+  grid-template-rows: minmax(var(--inkra-touch-target), 1fr);
+  inline-size: 100%;
   min-block-size: 12rem;
   min-inline-size: 0;
-  overflow: hidden;
+  overflow-x: hidden;
+  overflow-y: auto;
 }
 
-.inkra-log[data-toolbar="true"] { grid-template-rows: auto minmax(0, 1fr); }
+.inkra-log[data-toolbar="true"] { grid-template-rows: auto minmax(var(--inkra-touch-target), 1fr); }
+.inkra-log:has(> .inkra-log__latest) { grid-template-rows: minmax(var(--inkra-touch-target), 1fr) auto; }
+.inkra-log[data-toolbar="true"]:has(> .inkra-log__latest) { grid-template-rows: auto minmax(var(--inkra-touch-target), 1fr) auto; }
 
 .inkra-log__toolbar {
   align-items: center;
@@ -3177,6 +3524,8 @@
   flex-wrap: wrap;
   gap: var(--inkra-space-2);
   justify-content: space-between;
+  max-inline-size: 100%;
+  min-inline-size: 0;
   padding: var(--inkra-space-2) var(--inkra-space-3);
   position: relative;
 }
@@ -3200,26 +3549,49 @@
   min-inline-size: 0;
 }
 
+.inkra-log__filters > .inkra-button { flex: none; max-inline-size: 100%; }
+
 .inkra-log__filters .inkra-button[data-tone="info"] { color: var(--inkra-info-foreground); }
 .inkra-log__filters .inkra-button[data-tone="success"] { color: var(--inkra-success-foreground); }
 .inkra-log__filters .inkra-button[data-tone="warning"] { color: var(--inkra-warning-foreground); }
 .inkra-log__filters .inkra-button[data-tone="danger"] { color: var(--inkra-danger-foreground); }
 .inkra-log__follow-control { flex: none; }
 
-.inkra-log__viewport {
-  min-block-size: 0;
-  outline: 0;
-  overflow: auto;
-  overscroll-behavior: contain;
-  padding: var(--inkra-space-2) var(--inkra-space-3) var(--inkra-space-4);
-  scrollbar-gutter: stable;
-}
+.inkra-log__viewport-frame {
+  max-inline-size: 100%;
+  min-block-size: var(--inkra-touch-target);
+  min-inline-size: 0;
+  position: relative;
+}
+
+.inkra-log__focus-ring {
+  --inkra-accent-strong: var(--inkra-focus);
+  inset: var(--inkra-focus-width);
+  opacity: 0;
+  pointer-events: none;
+  position: absolute !important;
+  z-index: 3;
+}
+
+.inkra-log__viewport {
+  block-size: 100%;
+  box-sizing: border-box;
+  min-block-size: 0;
+  max-inline-size: 100%;
+  min-inline-size: 0;
+  outline: 0;
+  overflow: auto;
+  overscroll-behavior: contain;
+  padding: var(--inkra-space-2) var(--inkra-space-3) var(--inkra-space-4);
+  scrollbar-gutter: stable;
+}
 
 .inkra-log__viewport:focus-visible {
-  outline: var(--inkra-focus-width) solid var(--inkra-focus);
-  outline-offset: calc(-1 * var(--inkra-focus-width));
+  outline: 0;
 }
 
+.inkra-log__viewport-frame:has(.inkra-log__viewport:focus-visible) > .inkra-log__focus-ring { opacity: 1; }
+
 .inkra-log__list {
   display: grid;
   list-style: none;
@@ -3290,20 +3662,44 @@
 .inkra-log__latest {
   align-items: center;
   display: flex;
-  inset-block-end: var(--inkra-space-3);
-  inset-inline-end: var(--inkra-space-3);
-  position: absolute;
+  justify-content: flex-end;
+  max-inline-size: 100%;
+  min-inline-size: 0;
+  padding: var(--inkra-space-2) var(--inkra-space-3);
+  position: relative;
   z-index: 2;
 }
 
-@media (max-width: 36rem) {
+.inkra-log__latest-divider {
+  color: var(--inkra-border);
+  inset-block-start: -4px;
+  inset-inline: 0;
+  position: absolute;
+}
+
+@container (max-width: 36rem) {
   .inkra-log__toolbar { align-items: stretch; }
   .inkra-log__filters { flex-basis: 100%; overflow-x: auto; flex-wrap: nowrap; padding-block-end: var(--inkra-space-1); }
-  .inkra-log__follow-control { margin-inline-start: auto; }
+  .inkra-log__filters > .inkra-button .inkra-button__surface { height: auto; max-inline-size: 100%; min-height: var(--inkra-button-visual-height); padding-block: var(--inkra-space-2); }
+  .inkra-log__filters > .inkra-button .inkra-button__content,
+  .inkra-log__filters > .inkra-button .inkra-button__label,
+  .inkra-log__filters > .inkra-button .inkra-pencil-text,
+  .inkra-log__filters > .inkra-button .inkra-pencil-text__source { max-inline-size: 100%; min-inline-size: 0; white-space: normal; overflow-wrap: anywhere; }
+  .inkra-log__follow-control { inline-size: 100%; margin-inline-start: 0; }
+  .inkra-log__follow-control .inkra-button__surface { height: auto; inline-size: 100%; max-inline-size: 100%; min-height: var(--inkra-button-visual-height); padding-block: var(--inkra-space-2); }
+  .inkra-log__follow-control .inkra-button__content,
+  .inkra-log__follow-control .inkra-button__label,
+  .inkra-log__follow-control .inkra-pencil-text__source { min-inline-size: 0; white-space: normal; overflow-wrap: anywhere; }
+  .inkra-log__latest .inkra-button { inline-size: 100%; }
+  .inkra-log__latest .inkra-button__surface { height: auto; inline-size: 100%; max-inline-size: 100%; min-height: var(--inkra-button-visual-height); padding-block: var(--inkra-space-2); }
+  .inkra-log__latest .inkra-button__content,
+  .inkra-log__latest .inkra-button__label,
+  .inkra-log__latest .inkra-pencil-text__source { min-inline-size: 0; white-space: normal; overflow-wrap: anywhere; }
 }
 
 @media (forced-colors: active) {
-  .inkra-log__viewport:focus-visible { outline-color: Highlight; }
+  .inkra-pencil-surface.inkra-log__focus-ring { display: none !important; }
+  .inkra-log__viewport:focus-visible { outline: var(--inkra-focus-width) solid Highlight; outline-offset: calc(-1 * var(--inkra-focus-width)); }
   .inkra-log__icon,
   .inkra-log__level { color: CanvasText; }
 }
@@ -3361,6 +3757,7 @@
 .inkra-hotkey-input {
   --inkra-hotkey-input-height: var(--inkra-control-md);
 
+  position: relative;
   display: grid;
   inline-size: 20rem;
   max-inline-size: 100%;
@@ -3380,17 +3777,25 @@
   box-sizing: border-box;
   inline-size: 100%;
   min-inline-size: 0;
-  min-block-size: max(var(--inkra-hotkey-input-height), var(--inkra-touch-target));
+  block-size: var(--inkra-hotkey-input-height);
+  min-block-size: var(--inkra-hotkey-input-height);
   align-items: center;
+  margin-block: max(0px, calc((var(--inkra-touch-target) - var(--inkra-hotkey-input-height)) / 2));
+}
+
+.inkra-hotkey-input__control > .inkra-pencil-surface__content {
+  overflow: visible;
+  clip-path: none;
 }
 
 .inkra-hotkey-input__native {
   position: absolute;
   z-index: 2;
-  inset: 0;
+  inset-inline: 0;
+  inset-block: min(0px, calc((var(--inkra-hotkey-input-height) - var(--inkra-touch-target)) / 2));
   box-sizing: border-box;
   inline-size: 100%;
-  block-size: 100%;
+  block-size: auto;
   border: 0;
   outline: 0;
   background: transparent;
@@ -3414,19 +3819,45 @@
 }
 
 .inkra-hotkey-input:has(.inkra-hotkey-input__clear) .inkra-hotkey-input__value {
-  padding-inline-end: calc(var(--inkra-touch-target) + var(--inkra-space-2));
+  padding-inline-end: calc(max(var(--inkra-touch-target), var(--inkra-hotkey-input-height)) + var(--inkra-space-2));
 }
 
 .inkra-hotkey-input__placeholder { color: var(--inkra-ink-subtle); }
 
+.inkra-hotkey-input__recording {
+  color: var(--inkra-accent-strong);
+}
+
+.inkra-hotkey-input__focus-ring {
+  position: absolute !important;
+  z-index: 4;
+  inset: 2px;
+  opacity: 0;
+  pointer-events: none;
+  transition: opacity var(--inkra-motion-fast) var(--inkra-ease);
+}
+
+.inkra-hotkey-input[data-recording="true"] .inkra-hotkey-input__focus-ring { opacity: 1; }
+
+.inkra-hotkey-input__status {
+  position: absolute;
+  inline-size: 1px;
+  block-size: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+}
+
 .inkra-hotkey-input__clear {
   position: absolute;
   z-index: 3;
-  inset-block: 0;
+  inset-block: min(0px, calc((var(--inkra-hotkey-input-height) - var(--inkra-touch-target)) / 2));
   inset-inline-end: 0;
   display: inline-flex;
-  inline-size: var(--inkra-touch-target);
-  block-size: 100%;
+  inline-size: max(var(--inkra-touch-target), var(--inkra-hotkey-input-height));
+  block-size: auto;
   align-items: center;
   justify-content: center;
   border: 0;
@@ -3454,6 +3885,10 @@
   .inkra-hotkey-input__message { color: Mark; }
 }
 
+@media (prefers-reduced-motion: reduce) {
+  .inkra-hotkey-input__focus-ring { transition: none; }
+}
+
 @media print {
   .inkra-hotkey__key,
   .inkra-hotkey-input__control { border: 1px solid currentColor; }
@@ -3491,7 +3926,12 @@
 
 .inkra-number-ticker__prefix,
 .inkra-number-ticker__suffix {
+  align-items: center;
+  align-self: center;
   color: var(--inkra-ink-muted);
+  display: inline-flex;
+  flex: none;
+  gap: var(--inkra-space-1, 4px);
   min-width: 0;
 }
 
@@ -3538,7 +3978,7 @@
   }
 }
 
-.inkra-audio-player { box-sizing: border-box; color: var(--inkra-ink); display: grid; gap: var(--inkra-space-3); min-inline-size: 0; padding: var(--inkra-space-4); width: min(100%, 42rem); }
+.inkra-audio-player { box-sizing: border-box; color: var(--inkra-ink); container-type: inline-size; display: grid; gap: var(--inkra-space-3); min-inline-size: 0; padding: var(--inkra-space-4); width: min(100%, 42rem); }
 .inkra-audio-player > audio { height: 1px; opacity: 0; position: absolute; width: 1px; }
 .inkra-audio-player__controls { align-items: center; display: flex; flex-wrap: wrap; gap: var(--inkra-space-2); min-inline-size: 0; }
 .inkra-audio-player__seek { flex: 1 1 12rem; min-inline-size: 8rem; }
@@ -3546,12 +3986,13 @@
 .inkra-audio-player__seek .inkra-slider, .inkra-audio-player__volume .inkra-slider { min-inline-size: 0; width: 100%; }
 .inkra-audio-player__seek .inkra-slider { --inkra-slider-track-size: 28px; }
 .inkra-audio-player__volume .inkra-slider { --inkra-slider-track-size: 24px; }
-.inkra-audio-player__settings { align-items: center; display: flex; flex: 0 1 auto; gap: var(--inkra-space-2); min-inline-size: 0; }
-.inkra-audio-player__time { color: var(--inkra-ink-muted); font-variant-numeric: tabular-nums; min-inline-size: 7rem; text-align: center; }
+.inkra-audio-player__settings { align-items: center; display: flex; flex: 0 1 auto; flex-wrap: wrap; gap: var(--inkra-space-2); min-inline-size: 0; }
+.inkra-audio-player__time { color: var(--inkra-ink-muted); font-variant-numeric: tabular-nums; min-inline-size: 7rem; max-inline-size: 100%; overflow-wrap: anywhere; text-align: center; }
 .inkra-audio-player__settings > .inkra-select__trigger { flex: none; min-width: 5.5rem; }
 .inkra-audio-player__message { color: var(--inkra-ink-muted); margin: 0; }
 .inkra-audio-player__sr-only { block-size: 1px; clip: rect(0 0 0 0); clip-path: inset(50%); overflow: hidden; position: absolute; white-space: nowrap; inline-size: 1px; }
-@media (max-width: 40rem) { .inkra-audio-player__controls { align-items: stretch; } .inkra-audio-player__time { flex: 1 0 100%; order: 4; text-align: start; } .inkra-audio-player__seek { flex-basis: 10rem; } .inkra-audio-player__settings { flex: 1 1 100%; order: 5; } .inkra-audio-player__volume { flex: 1 1 8rem; } }
+@container (max-width: 40rem) { .inkra-audio-player__controls { align-items: stretch; } .inkra-audio-player__time { flex: 1 0 100%; min-inline-size: 0; order: 4; text-align: start; } .inkra-audio-player__seek { flex-basis: 10rem; } .inkra-audio-player__settings { flex: 1 1 100%; order: 5; } .inkra-audio-player__volume { flex: 1 1 8rem; } }
+@container (max-width: 20rem) { .inkra-audio-player__controls { display: grid; grid-template-columns: var(--inkra-touch-target) minmax(0, 1fr); } .inkra-audio-player__seek { min-inline-size: 0; } .inkra-audio-player__time, .inkra-audio-player__settings { grid-column: 1 / -1; } .inkra-audio-player__settings { display: grid; grid-template-columns: var(--inkra-touch-target) minmax(0, 1fr); width: 100%; } .inkra-audio-player__volume { min-inline-size: 0; } .inkra-audio-player__settings > .inkra-select__trigger { grid-column: 1 / -1; min-width: 0; width: 100%; } }
 @media (forced-colors: active) {
   .inkra-audio-player__controls { color: ButtonText; }
   .inkra-audio-player__time, .inkra-audio-player__message { color: CanvasText; }
@@ -3562,8 +4003,6 @@
 
 .inkra-carousel {
   --inkra-carousel-gap: 16px;
-  --inkra-carousel-visible: var(--inkra-carousel-visible-base, 1);
-
   container-type: inline-size;
   display: grid;
   gap: var(--inkra-space-3);
@@ -3572,7 +4011,19 @@
   position: relative;
 }
 
+.inkra-carousel__focus-ring {
+  --inkra-accent-strong: var(--inkra-focus);
+  inset: var(--inkra-focus-width);
+  opacity: 0;
+  pointer-events: none;
+  position: absolute !important;
+  z-index: 3;
+}
+.inkra-carousel:focus-visible { outline: 0; }
+.inkra-carousel:focus-visible > .inkra-carousel__focus-ring { opacity: 1; }
+
 .inkra-carousel__viewport {
+  --inkra-carousel-visible: var(--inkra-carousel-visible-base, 1);
   cursor: grab;
   min-inline-size: 0;
   overflow: hidden;
@@ -3583,8 +4034,8 @@
 .inkra-carousel[data-disabled] .inkra-carousel__viewport { cursor: default; }
 
 .inkra-carousel__container {
+  column-gap: var(--inkra-carousel-gap);
   display: flex;
-  margin-inline-end: calc(-1 * var(--inkra-carousel-gap));
   min-inline-size: 0;
 }
 
@@ -3592,7 +4043,6 @@
   box-sizing: border-box;
   flex: 0 0 calc((100% - (var(--inkra-carousel-visible) - 1) * var(--inkra-carousel-gap)) / var(--inkra-carousel-visible));
   min-inline-size: 0;
-  padding-inline-end: var(--inkra-carousel-gap);
   position: relative;
 }
 
@@ -3650,15 +4100,21 @@
   pointer-events: none;
 }
 
+.inkra-carousel__page-focus {
+  --inkra-accent-strong: var(--inkra-focus);
+  block-size: calc(var(--inkra-touch-target) - 4px);
+  inline-size: calc(var(--inkra-touch-target) - 4px);
+  opacity: 0;
+  pointer-events: none;
+  position: absolute !important;
+}
+
 .inkra-carousel__page[aria-current="true"] .inkra-carousel__page-mark {
   block-size: 14px;
   inline-size: 14px;
 }
 
-.inkra-carousel__page:focus-visible .inkra-carousel__page-mark {
-  --inkra-border: var(--inkra-focus);
-  --inkra-border-strong: var(--inkra-focus);
-}
+.inkra-carousel__page:focus-visible .inkra-carousel__page-focus { opacity: 1; }
 
 .inkra-carousel__empty {
   align-items: center;
@@ -3683,18 +4139,18 @@
 }
 
 @container (min-width: 30rem) {
-  .inkra-carousel { --inkra-carousel-visible: var(--inkra-carousel-visible-sm, var(--inkra-carousel-visible-base, 1)); }
+  .inkra-carousel__viewport { --inkra-carousel-visible: var(--inkra-carousel-visible-sm, var(--inkra-carousel-visible-base, 1)); }
 }
 
 @container (min-width: 48rem) {
-  .inkra-carousel { --inkra-carousel-visible: var(--inkra-carousel-visible-md, var(--inkra-carousel-visible-sm, var(--inkra-carousel-visible-base, 1))); }
+  .inkra-carousel__viewport { --inkra-carousel-visible: var(--inkra-carousel-visible-md, var(--inkra-carousel-visible-sm, var(--inkra-carousel-visible-base, 1))); }
 }
 
 @container (min-width: 64rem) {
-  .inkra-carousel { --inkra-carousel-visible: var(--inkra-carousel-visible-lg, var(--inkra-carousel-visible-md, var(--inkra-carousel-visible-sm, var(--inkra-carousel-visible-base, 1)))); }
+  .inkra-carousel__viewport { --inkra-carousel-visible: var(--inkra-carousel-visible-lg, var(--inkra-carousel-visible-md, var(--inkra-carousel-visible-sm, var(--inkra-carousel-visible-base, 1)))); }
 }
 
-@media (max-width: 390px) {
+@container (max-width: 390px) {
   .inkra-carousel__toolbar { align-items: flex-start; flex-wrap: wrap; }
   .inkra-carousel__pagination { order: 3; flex-basis: 100%; }
 }
@@ -3704,21 +4160,25 @@
 }
 
 @media (forced-colors: active) {
+  .inkra-pencil-surface.inkra-carousel__focus-ring,
+  .inkra-pencil-surface.inkra-carousel__page-focus { display: none !important; }
+  .inkra-carousel:focus-visible { outline: var(--inkra-focus-width) solid Highlight; outline-offset: calc(-1 * var(--inkra-focus-width)); }
   .inkra-carousel__page-mark { background: Canvas; border: 1px solid ButtonText; }
   .inkra-carousel__page[aria-current="true"] .inkra-carousel__page-mark { background: Highlight; border-color: Highlight; forced-color-adjust: none; }
-  .inkra-carousel__page:focus-visible { outline: var(--inkra-focus-width) solid Highlight; outline-offset: var(--inkra-focus-offset); }
+  .inkra-carousel__page:focus-visible { outline: var(--inkra-focus-width) solid Highlight; outline-offset: calc(-1 * var(--inkra-focus-width)); }
 }
 
 @media print {
   .inkra-carousel__toolbar { display: none; }
   .inkra-carousel__viewport { overflow: visible; }
-  .inkra-carousel__container { flex-wrap: wrap; gap: var(--inkra-carousel-gap); margin: 0; }
-  .inkra-carousel__slide { flex-basis: auto; padding: 0; }
+  .inkra-carousel__container { flex-wrap: wrap; gap: var(--inkra-carousel-gap); }
+  .inkra-carousel__slide { flex-basis: auto; }
 }
 
 .inkra-choice-grid {
   border: 0;
   color: var(--inkra-ink);
+  container-type: inline-size;
   margin: 0;
   max-inline-size: 100%;
   min-inline-size: 0;
@@ -3759,6 +4219,7 @@ div.inkra-choice-grid > .inkra-radio-group {
 }
 
 .inkra-choice-grid__selection,
+.inkra-choice-grid__focus,
 .inkra-choice-grid__outline {
   inset: 0;
   pointer-events: none;
@@ -3770,6 +4231,13 @@ div.inkra-choice-grid > .inkra-radio-group {
   z-index: 0;
 }
 
+.inkra-choice-grid__focus {
+  --inkra-accent-strong: var(--inkra-focus);
+  inset: calc(-1 * var(--inkra-focus-offset));
+  opacity: 0;
+  z-index: 3;
+}
+
 .inkra-choice-grid__outline { z-index: 2; }
 
 .inkra-choice-grid__option:has(.inkra-selection-control__input:checked) .inkra-choice-grid__selection {
@@ -3856,6 +4324,10 @@ div.inkra-choice-grid > .inkra-radio-group {
   overflow-wrap: anywhere;
 }
 
+.inkra-choice-grid__control .inkra-selection-control__focus-ring {
+  display: none !important;
+}
+
 .inkra-choice-grid__messages {
   display: grid;
   gap: var(--inkra-space-1);
@@ -3877,8 +4349,11 @@ div.inkra-choice-grid > .inkra-radio-group {
 }
 
 .inkra-choice-grid__option:has(.inkra-selection-control__input:focus-visible) {
-  outline: var(--inkra-focus-width) solid var(--inkra-focus);
-  outline-offset: var(--inkra-focus-offset);
+  outline: none;
+}
+
+.inkra-choice-grid__option:has(.inkra-selection-control__input:focus-visible) .inkra-choice-grid__focus {
+  opacity: 1;
 }
 
 .inkra-choice-grid__option:has(.inkra-selection-control__input:focus-visible) .inkra-selection-control__mark {
@@ -3892,6 +4367,13 @@ div.inkra-choice-grid > .inkra-radio-group {
   }
 }
 
+@container (max-width: 640px) {
+  .inkra-choice-grid[data-columns] .inkra-radio-group__items,
+  .inkra-choice-grid[data-columns] .inkra-choice-grid__items {
+    grid-template-columns: minmax(0, 1fr);
+  }
+}
+
 @media (forced-colors: active) {
   .inkra-choice-grid__option {
     border: 1px solid CanvasText;
@@ -3903,12 +4385,70 @@ div.inkra-choice-grid > .inkra-radio-group {
     outline-offset: -3px;
   }
 
-  .inkra-choice-grid__selection,
-  .inkra-choice-grid__outline {
+  .inkra-choice-grid__option:has(.inkra-selection-control__input:focus-visible) {
+    outline: var(--inkra-focus-width) solid Highlight;
+    outline-offset: var(--inkra-focus-offset);
+  }
+
+  .inkra-choice-grid__option > .inkra-choice-grid__selection,
+  .inkra-choice-grid__option > .inkra-choice-grid__focus,
+  .inkra-choice-grid__option > .inkra-choice-grid__outline {
     display: none;
   }
+
+  .inkra-choice-grid__control > .inkra-selection-control__input:focus-visible {
+    outline: none;
+  }
+}
+
+
+.inkra-color-swatch {
+  flex: none;
+}
+
+.inkra-color-swatch__background {
+  display: block;
+  inline-size: 100%;
+  block-size: 100%;
+  border-radius: 3px;
+  forced-color-adjust: none;
+}
+
+.inkra-color-swatch__pigment,
+.inkra-color-swatch__wash {
+  display: block;
+  inline-size: 28px;
+  block-size: 28px;
+  pointer-events: none;
+}
+
+.inkra-color-swatch[data-swatch-size="sm"] .inkra-color-swatch__pigment,
+.inkra-color-swatch[data-swatch-size="sm"] .inkra-color-swatch__wash {
+  inline-size: 20px;
+  block-size: 20px;
+}
+
+.inkra-color-swatch[data-swatch-size="lg"] .inkra-color-swatch__pigment,
+.inkra-color-swatch[data-swatch-size="lg"] .inkra-color-swatch__wash {
+  inline-size: 32px;
+  block-size: 32px;
+}
+
+.inkra-color-swatch__wash[data-pencil-fallback="true"] {
+  background: currentColor;
+  border: 0;
 }
 
+@media (forced-colors: active) {
+  .inkra-color-swatch__pigment {
+    background: currentColor;
+    forced-color-adjust: none;
+  }
+  .inkra-color-swatch[aria-pressed="true"] {
+    outline: 2px solid Highlight;
+    outline-offset: -3px;
+  }
+}
 
 .inkra-color-picker {
   box-sizing: border-box;
@@ -3917,7 +4457,7 @@ div.inkra-choice-grid > .inkra-radio-group {
   min-inline-size: 0;
   inline-size: min(100%, 28rem);
   margin: 0;
-  padding: var(--inkra-space-4);
+  padding: 0;
   border: 0;
   color: var(--inkra-ink);
   font-family: var(--inkra-font-body);
@@ -3929,25 +4469,71 @@ div.inkra-choice-grid > .inkra-radio-group {
 }
 
 .inkra-color-picker__legend {
-  padding: 0;
+  padding: 0 0 var(--inkra-space-2);
   color: var(--inkra-ink);
-  font-size: var(--inkra-text-lg);
+  font-size: var(--inkra-text-md);
+}
+
+.inkra-color-picker__editor {
+  display: grid;
+  gap: var(--inkra-space-3);
+  min-inline-size: 0;
+}
+
+.inkra-color-picker__gradient {
+  display: grid;
+  gap: var(--inkra-space-3);
+  min-inline-size: 0;
+  inline-size: 100%;
+}
+.inkra-color-picker__types { max-inline-size: 100%; }
+.inkra-color-picker__gradient-preview {
+  position: relative;
+  isolation: isolate;
+  block-size: 88px;
+  inline-size: 100%;
+  forced-color-adjust: none;
+}
+.inkra-color-picker__stop-toolbar,
+.inkra-color-picker__stops,
+.inkra-color-picker__stop-actions,
+.inkra-color-picker__radial-options {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: var(--inkra-space-2);
+  min-inline-size: 0;
+}
+.inkra-color-picker__stop-toolbar { justify-content: space-between; }
+.inkra-color-picker__stop-actions { gap: 0; }
+.inkra-color-picker__stop { display: grid; justify-items: center; font-size: var(--inkra-text-sm); }
+.inkra-color-picker__stop-position {
+  display: grid;
+  grid-template-columns: minmax(0, 6rem) minmax(0, 1fr);
+  align-items: end;
+  gap: var(--inkra-space-3);
+}
+.inkra-color-picker__geometry {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(min(100%, 6rem), 1fr));
+  gap: var(--inkra-space-3);
 }
+.inkra-color-picker__gradient .inkra-input-root { inline-size: 100%; }
+.inkra-color-picker__radial-options > * { max-inline-size: 100%; }
 
 .inkra-color-picker__main {
   display: grid;
   grid-template-columns: var(--inkra-control-lg) minmax(0, 1fr);
   gap: var(--inkra-space-3);
-  align-items: start;
+  align-items: center;
   min-width: 0;
 }
 
-.inkra-color-picker__palette,
-.inkra-color-picker__preset {
+.inkra-color-picker__palette {
   position: relative;
   isolation: isolate;
   display: block;
-  overflow: hidden;
+  overflow: visible;
   box-sizing: border-box;
   flex: none;
   padding: 0;
@@ -3977,20 +4563,26 @@ div.inkra-choice-grid > .inkra-radio-group {
   background-size: 12px 12px;
 }
 
-.inkra-color-picker__current,
-.inkra-color-picker__preset-color {
+.inkra-color-picker__current {
   position: absolute;
   z-index: -1;
   inset: 3px;
 }
 
 .inkra-color-picker__palette-outline,
-.inkra-color-picker__preset-outline {
+.inkra-color-picker__focus {
   position: absolute !important;
   inset: 0;
   pointer-events: none;
 }
 
+.inkra-color-picker__focus {
+  --inkra-accent-strong: var(--inkra-focus);
+  inset: calc(-1 * var(--inkra-focus-offset));
+  opacity: 0;
+  z-index: 2;
+}
+
 .inkra-color-picker__native {
   position: absolute;
   z-index: 1;
@@ -4003,10 +4595,8 @@ div.inkra-choice-grid > .inkra-radio-group {
   opacity: 0;
 }
 
-.inkra-color-picker__palette:focus-within,
-.inkra-color-picker__preset:focus-visible {
-  outline: var(--inkra-focus-width) solid var(--inkra-focus);
-  outline-offset: var(--inkra-focus-offset);
+.inkra-color-picker__palette:focus-within .inkra-color-picker__focus {
+  opacity: 1;
 }
 
 .inkra-color-picker__value-field {
@@ -4059,17 +4649,14 @@ div.inkra-choice-grid > .inkra-radio-group {
 }
 
 .inkra-color-picker__presets {
-  display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(44px, 1fr));
+  display: flex;
+  flex-wrap: wrap;
   gap: var(--inkra-space-2);
   min-width: 0;
 }
 
 .inkra-color-picker__preset {
-  width: 100%;
   min-width: var(--inkra-touch-target);
-  height: var(--inkra-touch-target);
-  cursor: pointer;
 }
 
 .inkra-color-picker__preset:disabled,
@@ -4077,27 +4664,72 @@ div.inkra-choice-grid > .inkra-radio-group {
   cursor: not-allowed;
 }
 
-@media (max-width: 360px) {
-  .inkra-color-picker {
-    padding: var(--inkra-space-3);
-  }
+.inkra-color-picker__trigger-content {
+  display: flex;
+  align-items: center;
+  gap: var(--inkra-space-2);
+}
 
-  .inkra-color-picker__main {
-    grid-template-columns: 1fr;
-  }
+.inkra-color-picker__preview {
+  position: relative;
+  isolation: isolate;
+  flex: none;
+  inline-size: 28px;
+  block-size: 28px;
+}
+
+.inkra-color-picker__trigger {
+  justify-self: start;
+  max-inline-size: 100%;
+}
+
+.inkra-color-picker__popover {
+  inline-size: min(22rem, calc(100vw - 24px));
+  max-inline-size: var(--radix-popover-content-available-width);
+}
+
+.inkra-color-picker__editor[data-presentation="compact"] {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  column-gap: var(--inkra-space-4);
+}
+
+.inkra-color-picker__editor[data-presentation="compact"] .inkra-color-picker__main {
+  flex: 1 1 12rem;
+}
+
+.inkra-color-picker__editor[data-presentation="compact"] .inkra-color-picker__alpha {
+  flex: 1 1 8rem;
+}
+
+.inkra-color-picker__editor[data-presentation="compact"] .inkra-color-picker__presets {
+  flex-basis: 100%;
+}
+
+.inkra-color-picker__editor[data-presentation="compact"] .inkra-color-picker__divider {
+  display: none;
 }
 
 @media (forced-colors: active) {
-  .inkra-color-picker__palette,
-  .inkra-color-picker__preset {
+  .inkra-color-picker__palette {
     border: 1px solid ButtonText;
     forced-color-adjust: none;
   }
 
-  .inkra-color-picker__palette:focus-within,
-  .inkra-color-picker__preset:focus-visible {
+  .inkra-color-picker__palette:focus-within {
+    outline: var(--inkra-focus-width) solid Highlight;
+    outline-offset: var(--inkra-focus-offset);
     outline-color: Highlight;
   }
+
+  .inkra-color-picker__focus {
+    display: none !important;
+  }
+
+  .inkra-color-picker__preview {
+    forced-color-adjust: none;
+  }
 }
 
 .inkra-context-menu__anchor {
@@ -4120,7 +4752,8 @@ div.inkra-choice-grid > .inkra-radio-group {
 }
 
 .inkra-context-menu__sub-content {
-  max-block-size: var(--radix-dropdown-menu-content-available-height);
+  max-block-size: var(--radix-dropdown-menu-content-available-height, calc(100dvh - 16px));
+  max-inline-size: min(320px, var(--radix-dropdown-menu-content-available-width, calc(100vw - 16px)), calc(100vw - 16px));
   transform-origin: var(--radix-dropdown-menu-content-transform-origin);
 }
 
@@ -4247,51 +4880,150 @@ div.inkra-choice-grid > .inkra-radio-group {
 }
 
 .inkra-editable {
+  --inkra-editable-control-height: var(--inkra-control-md);
+
+  display: inline-grid;
+  inline-size: min(100%, 30rem);
+  min-inline-size: 0;
   color: var(--inkra-ink);
-  display: inline-flex;
-  flex-direction: column;
+  vertical-align: middle;
+}
+
+.inkra-editable[data-size="sm"] { --inkra-editable-control-height: var(--inkra-control-sm); }
+.inkra-editable[data-size="lg"] { --inkra-editable-control-height: var(--inkra-control-lg); }
+
+.inkra-editable__frame {
+  display: grid;
+  min-inline-size: 0;
+  align-items: start;
   gap: var(--inkra-space-2);
-  max-inline-size: 100%;
+  min-block-size: max(var(--inkra-editable-control-height), var(--inkra-touch-target));
+}
+
+.inkra-editable__display-shell {
+  position: relative;
+  display: grid;
   min-inline-size: 0;
-  vertical-align: middle;
+  min-block-size: max(var(--inkra-editable-control-height), var(--inkra-touch-target));
+  align-items: center;
+}
+
+.inkra-editable__focus-ring {
+  position: absolute !important;
+  inset-inline: 0;
+  inset-block: 50% auto;
+  block-size: var(--inkra-editable-control-height);
+  transform: translateY(-50%);
+  opacity: 0;
+  pointer-events: none;
+  transition: opacity var(--inkra-motion-fast) var(--inkra-ease);
+}
+
+.inkra-editable__display-shell:has(:focus-visible) .inkra-editable__focus-ring {
+  opacity: 1;
 }
 
 .inkra-editable__display {
+  position: relative;
+  z-index: 1;
+  display: flex;
+  min-inline-size: 0;
+  box-sizing: border-box;
+  inline-size: 100%;
+  min-block-size: max(var(--inkra-editable-control-height), var(--inkra-touch-target));
   align-items: center;
-  border-radius: var(--inkra-radius-sm);
-  cursor: text;
-  display: inline-flex;
-  min-block-size: var(--inkra-touch-target);
-  min-inline-size: 2.75rem;
+  padding: 0 var(--inkra-space-3);
+  border: 0;
   outline: 0;
+  background: transparent;
+  color: inherit;
+  font: inherit;
+  cursor: text;
   overflow-wrap: anywhere;
-  padding-inline: var(--inkra-space-2);
-  position: relative;
   text-align: start;
-  transition: background-color var(--inkra-motion-fast) var(--inkra-ease), outline-color var(--inkra-motion-fast) var(--inkra-ease);
 }
 
-.inkra-editable__display:hover { background: color-mix(in srgb, var(--inkra-accent-soft) 12%, transparent); }
-.inkra-editable__display:focus-visible { outline: var(--inkra-focus-width) solid var(--inkra-focus); outline-offset: var(--inkra-focus-offset); }
-.inkra-editable__display[aria-disabled="true"] { cursor: default; opacity: .62; }
+.inkra-editable[data-multiline="true"] .inkra-editable__display {
+  block-size: auto;
+  min-block-size: var(--inkra-editable-control-height);
+  align-items: flex-start;
+  padding-block: var(--inkra-space-2);
+  white-space: pre-wrap;
+}
+
+.inkra-editable[data-disabled="true"] .inkra-editable__display,
+.inkra-editable[data-readonly="true"] .inkra-editable__display {
+  cursor: default;
+}
 
-.inkra-editable__editor { display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--inkra-space-2); min-inline-size: min(100%, 15rem); }
-.inkra-editable__editor > :first-child { flex: 1 1 12rem; min-inline-size: 0; }
-.inkra-editable__actions { display: inline-flex; flex: 0 0 auto; flex-wrap: wrap; gap: var(--inkra-space-2); min-block-size: var(--inkra-touch-target); align-items: center; }
-.inkra-editable__error { color: var(--inkra-danger); font-size: var(--inkra-text-sm); inline-size: 100%; }
+.inkra-editable[data-disabled="true"] .inkra-editable__display-shell {
+  opacity: .62;
+}
 
-@media (max-width: 30rem) {
-  .inkra-editable__editor { align-items: stretch; flex-direction: column; }
-  .inkra-editable__editor > :first-child, .inkra-editable__actions { inline-size: 100%; }
+.inkra-editable__editor {
+  display: grid;
+  min-inline-size: 0;
+  min-block-size: max(var(--inkra-editable-control-height), var(--inkra-touch-target));
+  align-content: center;
+  gap: var(--inkra-space-2);
+}
+
+.inkra-editable__editor > :first-child {
+  inline-size: 100%;
+  min-inline-size: 0;
+}
+
+.inkra-editable__actions {
+  display: inline-grid;
+  flex: none;
+  min-block-size: max(var(--inkra-editable-control-height), var(--inkra-touch-target));
+  grid-template-columns: repeat(2, var(--inkra-touch-target));
+  align-items: center;
+}
+
+.inkra-editable__action {
+  inline-size: var(--inkra-touch-target);
+  block-size: var(--inkra-touch-target);
+}
+
+.inkra-editable__custom-trigger {
+  position: absolute;
+  inline-size: 1px;
+  block-size: 1px;
+  overflow: hidden;
+  clip-path: inset(50%);
+  white-space: nowrap;
+}
+
+.inkra-editable__select-row,
+.inkra-editable__custom-row {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) auto;
+  align-items: start;
+  gap: var(--inkra-space-1);
+  min-inline-size: 0;
+}
+
+.inkra-editable__error {
+  inline-size: 100%;
+  color: var(--inkra-danger-foreground, var(--inkra-danger));
+  font-size: var(--inkra-text-sm);
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .inkra-editable__focus-ring { transition: none; }
 }
 
-@media (prefers-reduced-motion: reduce) { .inkra-editable__display { transition: none; } }
 @media (forced-colors: active) {
-  .inkra-editable__display:hover { background: transparent; }
-  .inkra-editable__display:focus-visible { outline: 2px solid Highlight; }
-  .inkra-editable__error { color: CanvasText; }
+  .inkra-editable__display-shell:has(:focus-visible) { outline: 2px solid Highlight; outline-offset: -2px; }
+  .inkra-editable__focus-ring { display: none; }
+  .inkra-editable__error { color: Mark; }
+}
+
+@media print {
+  .inkra-editable__actions,
+  .inkra-editable__focus-ring { display: none; }
 }
-@media print { .inkra-editable__display { background: transparent; } }
 
 .inkra-tilt {
   --inkra-tilt-response: 120ms;
@@ -4887,40 +5619,91 @@ div.inkra-choice-grid > .inkra-radio-group {
 }
 
 .inkra-image-viewer.inkra-overlay__content {
-  height: min(52rem, calc(100dvh - var(--inkra-space-8)));
-  max-height: calc(100dvh - var(--inkra-space-8));
-  width: min(72rem, calc(100vw - var(--inkra-space-8)));
+  animation: inkra-image-viewer-in var(--inkra-motion-normal) var(--inkra-ease) both;
+  height: 100dvh;
+  inset: 0;
+  left: 0;
+  max-height: none;
+  max-width: none;
+  transform: none;
+  width: 100dvw;
 }
 
-.inkra-image-viewer .inkra-overlay__surface,
-.inkra-image-viewer .inkra-overlay__content-body {
-  height: 100%;
+.inkra-image-viewer.inkra-overlay__content[data-state="closed"] {
+  animation: inkra-image-viewer-out var(--inkra-motion-normal) var(--inkra-ease) both;
 }
 
-.inkra-image-viewer__description {
+.inkra-image-viewer > .inkra-overlay__surface {
+  border-radius: 0;
+  block-size: 0;
+  inline-size: 0;
+  inset: 0;
+  max-height: none;
+  overflow: visible;
   position: absolute;
-  width: 1px;
-  height: 1px;
+}
+
+.inkra-image-viewer > .inkra-overlay__surface { background: var(--inkra-paper); }
+
+.inkra-image-viewer > .inkra-overlay__surface > .inkra-pencil-surface__ink { display: none !important; }
+
+.inkra-image-viewer > .inkra-overlay__surface > .inkra-overlay__content-body {
+  background: var(--inkra-paper);
+  display: flex;
+  flex-direction: column;
+  height: 100dvh;
+  inset: 0;
+  max-height: none;
+  overflow: hidden;
   padding: 0;
+  position: fixed;
+  width: 100dvw;
+}
+
+.inkra-image-viewer__accessible-label {
+  block-size: 1px;
+  clip: rect(0 0 0 0);
+  clip-path: inset(50%);
+  inline-size: 1px;
   margin: -1px;
   overflow: hidden;
-  clip: rect(0, 0, 0, 0);
+  padding: 0;
+  position: absolute;
   white-space: nowrap;
 }
 
+.inkra-image-viewer__close-control {
+  inset-block-start: max(var(--inkra-space-3), env(safe-area-inset-top));
+  inset-inline-end: max(var(--inkra-space-3), env(safe-area-inset-right));
+  isolation: isolate;
+  position: absolute;
+  z-index: 8;
+}
+
+.inkra-image-viewer__close-paper {
+  inset: 0;
+  pointer-events: none;
+  position: absolute !important;
+  z-index: 0;
+}
+
+.inkra-image-viewer__close-control > .inkra-button { position: relative; z-index: 1; }
+
 .inkra-image-viewer__counter {
   color: var(--inkra-ink-muted);
+  flex: 0 0 auto;
   font-size: var(--inkra-text-sm);
   line-height: var(--inkra-line-ui);
+  unicode-bidi: isolate;
+  white-space: nowrap;
 }
 
 .inkra-image-viewer__body {
   display: grid;
   flex: 1 1 auto;
-  min-block-size: 0;
+  min-block-size: var(--inkra-touch-target);
   min-inline-size: 0;
   overflow: hidden;
-  padding: var(--inkra-space-4);
 }
 
 .inkra-image-viewer__stage,
@@ -4928,178 +5711,334 @@ div.inkra-choice-grid > .inkra-radio-group {
   min-block-size: 0;
   min-inline-size: 0;
   outline: 0;
+  position: relative;
 }
 
 .inkra-image-viewer__stage {
-  position: relative;
-  display: grid;
-  place-items: center;
-  overflow: hidden;
-  background: var(--inkra-surface-muted);
   background: color-mix(in srgb, var(--inkra-ink) 7%, var(--inkra-paper));
-  border-radius: var(--inkra-radius-md);
   contain: layout paint;
+  display: grid;
+  overflow: hidden;
+  place-items: center;
 }
 
-.inkra-image-viewer__stage:focus-visible {
-  box-shadow: inset 0 0 0 var(--inkra-focus-width) var(--inkra-focus);
+.inkra-image-viewer__stage-focus {
+  --inkra-accent-strong: var(--inkra-focus);
+
+  display: block !important;
+  inset: var(--inkra-focus-width);
+  opacity: 0;
+  pointer-events: none;
+  position: absolute !important;
+  z-index: 7;
 }
 
+.inkra-image-viewer__stage:focus-visible > .inkra-image-viewer__stage-focus,
+.inkra-image-viewer__state:focus-visible > .inkra-image-viewer__stage-focus { opacity: 1; }
+
 .inkra-image-viewer__image {
+  block-size: 100%;
   display: block;
   inline-size: 100%;
-  block-size: 100%;
-  max-inline-size: 100%;
   max-block-size: 100%;
+  max-inline-size: 100%;
   object-fit: contain;
   user-select: none;
 }
 
-.inkra-image-viewer__pan-zoom,
-.inkra-image-viewer__pan-zoom > .react-transform-wrapper {
-  inline-size: 100%;
+.inkra-image-viewer .inkra-image-viewer__pan-zoom.inkra-pan-zoom {
+  --inkra-pan-zoom-min-block-size: 0px;
+}
+
+.inkra-image-viewer .inkra-image-viewer__pan-zoom,
+.inkra-image-viewer .inkra-image-viewer__pan-zoom > .inkra-pan-zoom__clip,
+.inkra-image-viewer .inkra-image-viewer__pan-zoom > .inkra-pan-zoom__clip > .react-transform-wrapper,
+.inkra-image-viewer .inkra-image-viewer__pan-zoom .inkra-pan-zoom__viewport {
   block-size: 100%;
+  inline-size: 100%;
+  max-block-size: 100%;
   min-block-size: 0;
 }
 
 .inkra-image-viewer__pan-zoom .inkra-pan-zoom__viewport {
-  inline-size: 100%;
-  block-size: 100%;
-  min-block-size: 0;
+  background: transparent;
   border: 0;
   border-radius: 0;
-  background: transparent;
 }
 
 .inkra-image-viewer__pan-zoom .inkra-pan-zoom__content {
-  inline-size: 100%;
-  block-size: 100%;
   align-items: center;
+  block-size: 100%;
+  inline-size: 100%;
   justify-content: center;
 }
 
 .inkra-image-viewer__image-transform {
+  block-size: 100%;
   display: grid;
   inline-size: 100%;
-  block-size: 100%;
   place-items: center;
   transform-origin: center;
 }
 
-.inkra-image-viewer__tools {
-  position: absolute;
-  inset-block-end: var(--inkra-space-3);
-  inset-inline-start: 50%;
-  display: flex;
-  align-items: center;
-  gap: var(--inkra-space-1);
-  transform: translateX(-50%);
-  z-index: 1;
-}
-
 .inkra-image-viewer__navigation {
-  position: absolute;
   inset: 0;
   pointer-events: none;
+  position: absolute;
 }
 
 .inkra-image-viewer__navigation > .inkra-button {
-  position: absolute;
   inset-block-start: 50%;
-  transform: translateY(-50%);
   pointer-events: auto;
+  position: absolute;
+  transform: translateY(-50%);
 }
 
-.inkra-image-viewer__previous { inset-inline-start: var(--inkra-space-3); }
-.inkra-image-viewer__next { inset-inline-end: var(--inkra-space-3); }
+.inkra-image-viewer__previous { inset-inline-start: max(var(--inkra-space-3), env(safe-area-inset-left)); }
+.inkra-image-viewer__next { inset-inline-end: max(var(--inkra-space-3), env(safe-area-inset-right)); }
 
 .inkra-image-viewer__state {
-  display: grid;
   align-content: center;
-  justify-items: center;
+  display: grid;
   gap: var(--inkra-space-3);
+  justify-items: center;
+  overflow-wrap: anywhere;
   padding: var(--inkra-space-5);
   text-align: center;
-  overflow-wrap: anywhere;
 }
 
 .inkra-image-viewer__state h3,
 .inkra-image-viewer__state p { margin: 0; }
 .inkra-image-viewer__state p { color: var(--inkra-ink-muted); }
 
-.inkra-image-viewer__thumbnails {
-  display: flex;
+.inkra-image-viewer__bottom {
   flex: none;
-  gap: var(--inkra-space-2);
+  max-block-size: min(34dvh, 15rem);
+  min-inline-size: 0;
+  overflow: auto;
+  overscroll-behavior: contain;
+  padding-block-end: env(safe-area-inset-bottom);
+  scrollbar-gutter: auto;
+}
+
+.inkra-image-viewer__bottom-row {
+  align-items: center;
+  display: flex;
+  gap: var(--inkra-space-3);
+  justify-content: center;
+  min-block-size: var(--inkra-touch-target);
   min-inline-size: 0;
   overflow-x: auto;
   overscroll-behavior-inline: contain;
-  padding: var(--inkra-space-3) var(--inkra-space-5) var(--inkra-space-4);
-  scrollbar-gutter: stable;
+  padding: var(--inkra-space-2) var(--inkra-space-4);
+  scrollbar-gutter: auto;
 }
 
-.inkra-image-viewer__thumbnail {
+.inkra-image-viewer__tools {
+  align-items: center;
+  display: flex;
+  flex: none;
+  gap: var(--inkra-space-1);
+  isolation: isolate;
+  max-inline-size: 100%;
+  overflow-x: auto;
+  overscroll-behavior-inline: contain;
+  padding: var(--inkra-focus-offset);
   position: relative;
-  flex: 0 0 5rem;
-  inline-size: 5rem;
-  block-size: 3.75rem;
-  padding: 0;
-  border: 0;
-  color: inherit;
-  background: transparent;
-  cursor: pointer;
+  scrollbar-gutter: auto;
 }
 
-.inkra-image-viewer__thumbnail-surface,
-.inkra-image-viewer__thumbnail-focus {
-  position: absolute;
-  inset: 0;
-  display: block;
+.inkra-image-viewer__video-navigation {
+  align-items: center;
+  align-self: center;
+  display: flex;
+  flex: none;
+  gap: var(--inkra-space-2);
+  min-inline-size: max-content;
 }
 
-.inkra-image-viewer__thumbnail-focus {
-  opacity: 0;
+.inkra-image-viewer__tools-paper {
+  inset: 0;
   pointer-events: none;
+  position: absolute !important;
+  z-index: 0;
 }
+.inkra-image-viewer__tools > .inkra-button { position: relative; z-index: 1; }
 
-.inkra-image-viewer__thumbnail:focus-visible { outline: 0; }
-.inkra-image-viewer__thumbnail:focus-visible .inkra-image-viewer__thumbnail-focus { opacity: 1; }
-
-.inkra-image-viewer__thumbnail-image {
-  position: absolute;
-  inset: var(--inkra-space-1);
-  inline-size: calc(100% - var(--inkra-space-2));
+.inkra-image-viewer__thumbnails {
+  display: flex;
+  gap: var(--inkra-space-2);
+  justify-content: safe center;
+  min-inline-size: 0;
+  overflow-x: auto;
+  overscroll-behavior-inline: contain;
+  padding: var(--inkra-space-2) var(--inkra-space-4) var(--inkra-space-3);
+  scrollbar-gutter: auto;
+}
+
+.inkra-image-viewer__thumbnail {
+  background: transparent;
+  block-size: 3.75rem;
+  border: 0;
+  color: inherit;
+  cursor: pointer;
+  flex: 0 0 5rem;
+  inline-size: 5rem;
+  padding: 0;
+  position: relative;
+}
+
+.inkra-image-viewer__thumbnail-surface,
+.inkra-image-viewer__thumbnail-focus {
+  display: block;
+  inset: 0;
+  position: absolute;
+}
+
+.inkra-image-viewer__thumbnail-surface { align-items: center; justify-content: center; }
+.inkra-image-viewer__thumbnail-video {
+  align-items: center;
+  block-size: 1.75rem;
+  display: inline-flex !important;
+  inline-size: 1.75rem;
+  inset-block-end: var(--inkra-space-1);
+  inset-inline-end: var(--inkra-space-1);
+  justify-content: center;
+  pointer-events: none;
+  position: absolute !important;
+  z-index: 2;
+}
+.inkra-image-viewer__thumbnail-focus { opacity: 0; pointer-events: none; }
+.inkra-image-viewer__thumbnail:focus-visible { outline: 0; }
+.inkra-image-viewer__thumbnail:focus-visible .inkra-image-viewer__thumbnail-focus { opacity: 1; }
+
+.inkra-image-viewer__thumbnail-image {
   block-size: calc(100% - var(--inkra-space-2));
   border-radius: var(--inkra-radius-sm);
+  inline-size: calc(100% - var(--inkra-space-2));
+  inset: var(--inkra-space-1);
   object-fit: cover;
   pointer-events: none;
+  position: absolute;
   user-select: none;
 }
 
-@media (max-width: 30rem) {
-  .inkra-image-viewer.inkra-overlay__content {
-    height: calc(100dvh - var(--inkra-space-4));
-    max-height: calc(100dvh - var(--inkra-space-4));
-    width: calc(100vw - var(--inkra-space-4));
-  }
+@keyframes inkra-image-viewer-in { from { opacity: 0; } to { opacity: 1; } }
+@keyframes inkra-image-viewer-out { from { opacity: 1; } to { opacity: 0; } }
+
+@media (max-width: 30rem) and (min-height: 30.001rem) {
+  .inkra-image-viewer__bottom-row { align-items: stretch; flex-direction: column; gap: var(--inkra-space-1); }
+  .inkra-image-viewer__counter { align-self: center; }
+  .inkra-image-viewer__tools { align-self: center; }
+}
 
-  .inkra-image-viewer__body { padding: var(--inkra-space-2); }
+@media (max-width: 30rem) {
   .inkra-image-viewer__previous { inset-inline-start: var(--inkra-space-2); }
   .inkra-image-viewer__next { inset-inline-end: var(--inkra-space-2); }
   .inkra-image-viewer__thumbnails { padding-inline: var(--inkra-space-3); }
-  .inkra-image-viewer__tools { inset-block-end: var(--inkra-space-2); }
+}
+
+@media (max-height: 30rem) {
+  .inkra-image-viewer__bottom { max-block-size: min(40dvh, 12rem); }
+  .inkra-image-viewer__bottom-row { justify-content: safe center; padding-block: var(--inkra-space-1); }
+  .inkra-image-viewer__thumbnails { padding-block: var(--inkra-space-1); }
+  .inkra-image-viewer__thumbnail { block-size: var(--inkra-touch-target); }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .inkra-image-viewer.inkra-overlay__content { animation: none !important; }
 }
 
 @media (forced-colors: active) {
   .inkra-image-viewer__stage { border: 1px solid CanvasText; }
+  .inkra-pencil-surface.inkra-image-viewer__stage-focus,
+  .inkra-pencil-surface.inkra-image-viewer__tools-paper,
+  .inkra-pencil-surface.inkra-image-viewer__close-paper { display: none !important; }
+  .inkra-image-viewer__stage:focus-visible,
+  .inkra-image-viewer__state:focus-visible { outline: var(--inkra-focus-width) solid Highlight; outline-offset: calc(-1 * var(--inkra-focus-width)); }
   .inkra-image-viewer__thumbnail { border: 1px solid CanvasText; }
   .inkra-image-viewer__thumbnail[aria-selected="true"] { border-width: 3px; }
+  .inkra-pencil-surface.inkra-image-viewer__thumbnail-video { display: none !important; }
   .inkra-image-viewer__pan-zoom .inkra-pan-zoom__viewport { border: 0; }
 }
 
 @media print {
+  .inkra-image-viewer__close-control,
   .inkra-image-viewer__navigation,
-  .inkra-image-viewer__thumbnails { display: none; }
+  .inkra-image-viewer__bottom { display: none; }
+}
+
+.inkra-image-viewer__video-resource {
+  block-size: 100%;
+  box-sizing: border-box;
+  container-type: inline-size;
+  display: grid;
+  grid-template-rows: minmax(var(--inkra-touch-target), 1fr) auto;
+  inline-size: 100%;
+  min-block-size: 0;
+  min-inline-size: 0;
+  overflow: hidden;
+}
+
+.inkra-image-viewer__video-media {
+  align-self: stretch;
+  background: #000;
+  block-size: 100%;
+  display: block;
+  inline-size: 100%;
+  min-block-size: 0;
+  object-fit: contain;
+}
+
+.inkra-image-viewer__video-controls {
+  align-items: center;
+  background: var(--inkra-paper);
+  box-sizing: border-box;
+  color: var(--inkra-ink);
+  display: grid;
+  gap: var(--inkra-space-2);
+  grid-template-areas:
+    "play seek time"
+    "settings settings settings";
+  grid-template-columns: var(--inkra-touch-target) minmax(var(--inkra-touch-target), 1fr) minmax(0, 6.5rem);
+  grid-template-rows: minmax(var(--inkra-touch-target), auto) minmax(var(--inkra-touch-target), auto);
+  inline-size: 100%;
+  min-inline-size: 0;
+  padding: var(--inkra-space-2) var(--inkra-space-3);
+}
+
+.inkra-image-viewer__video-play { grid-area: play; }
+.inkra-image-viewer__video-seek { grid-area: seek; min-inline-size: 0; }
+.inkra-image-viewer__video-volume { grid-area: volume; min-inline-size: 0; }
+.inkra-image-viewer__video-seek .inkra-slider,
+.inkra-image-viewer__video-volume .inkra-slider { inline-size: 100%; min-inline-size: 0; }
+.inkra-image-viewer__video-time { color: var(--inkra-ink-muted); font-variant-numeric: tabular-nums; grid-area: time; min-inline-size: 0; overflow-wrap: anywhere; text-align: center; unicode-bidi: isolate; }
+.inkra-image-viewer__video-settings {
+  align-items: center;
+  display: grid;
+  gap: var(--inkra-space-2);
+  grid-area: settings;
+  grid-template-areas: "mute volume rate";
+  grid-template-columns: var(--inkra-touch-target) minmax(var(--inkra-touch-target), 1fr) minmax(5.5rem, max-content);
+  min-inline-size: 0;
+}
+.inkra-image-viewer__video-mute { grid-area: mute; }
+.inkra-image-viewer__video-settings > .inkra-select__trigger { grid-area: rate; inline-size: 100%; min-inline-size: 5.5rem; }
+.inkra-image-viewer__video-error { color: var(--inkra-danger); grid-column: 1 / -1; margin: 0; overflow-wrap: anywhere; }
+
+@container (max-width: 22rem) {
+  .inkra-image-viewer__video-controls { column-gap: var(--inkra-space-1); padding-inline: var(--inkra-space-2); }
+  .inkra-image-viewer__video-settings { column-gap: var(--inkra-space-1); }
+}
+
+@media (forced-colors: active) {
+  .inkra-image-viewer__video-media { border: 1px solid CanvasText; }
+  .inkra-image-viewer__video-controls { border-block-start: 1px solid CanvasText; }
+  .inkra-image-viewer__video-error { color: Mark; }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .inkra-image-viewer__video-resource * { animation: none !important; transition: none !important; }
 }
 
 .inkra-keypad {
@@ -5535,16 +6474,30 @@ div.inkra-choice-grid > .inkra-radio-group {
   display: inline-flex;
   max-inline-size: 100%;
   outline: none;
-  overflow-x: auto;
-  overscroll-behavior-inline: contain;
+  position: relative;
   touch-action: manipulation;
 }
 
+.inkra-rating__focus-ring {
+  --inkra-accent-strong: var(--inkra-focus);
+  inset: 1px;
+  opacity: 0;
+  pointer-events: none;
+  position: absolute !important;
+  z-index: 2;
+}
+
 .inkra-rating__symbols {
   display: inline-flex;
   flex: 0 0 auto;
+  max-inline-size: 100%;
+  overflow-x: auto;
+  overscroll-behavior-inline: contain;
+  scrollbar-width: none;
 }
 
+.inkra-rating__symbols::-webkit-scrollbar { display: none; }
+
 .inkra-rating__symbol-target {
   block-size: var(--inkra-touch-target);
   cursor: pointer;
@@ -5584,8 +6537,11 @@ div.inkra-choice-grid > .inkra-radio-group {
 }
 
 .inkra-rating:focus-visible {
-  outline: var(--inkra-focus-width) solid var(--inkra-focus);
-  outline-offset: var(--inkra-focus-offset);
+  outline: none;
+}
+
+.inkra-rating:focus-visible > .inkra-rating__focus-ring {
+  opacity: 1;
 }
 
 .inkra-rating[data-readonly] .inkra-rating__symbol-target,
@@ -5608,7 +6564,18 @@ div.inkra-choice-grid > .inkra-radio-group {
   }
 
   .inkra-rating:focus-visible {
-    outline: 2px solid Highlight;
+    outline: var(--inkra-focus-width) solid Highlight;
+    outline-offset: calc(-1 * var(--inkra-focus-width));
+  }
+
+  .inkra-rating__focus-ring {
+    display: none !important;
+  }
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  .inkra-rating__focus-ring {
+    transition: opacity var(--inkra-motion-fast) var(--inkra-ease);
   }
 }
 
@@ -5617,6 +6584,10 @@ div.inkra-choice-grid > .inkra-radio-group {
     color: CanvasText;
     overflow: visible;
   }
+
+  .inkra-rating__focus-ring {
+    display: none !important;
+  }
 }
 
 .inkra-resizable {
@@ -5729,8 +6700,8 @@ div.inkra-choice-grid > .inkra-radio-group {
 }
 
 .inkra-scroll-area {
-  --inkra-scroll-area-size: 10px;
-  --inkra-scroll-area-gap: 3px;
+  --inkra-scroll-area-size: 14px;
+  --inkra-scroll-area-gap: 2px;
   color: var(--inkra-ink);
   min-block-size: 0;
   min-inline-size: 0;
@@ -5751,6 +6722,7 @@ div.inkra-choice-grid > .inkra-radio-group {
 .inkra-scroll-area__content { min-block-size: 100%; min-inline-size: 100%; }
 
 .inkra-scroll-area__scrollbar {
+  align-items: stretch;
   box-sizing: border-box;
   display: flex;
   opacity: 0;
@@ -5760,10 +6732,12 @@ div.inkra-choice-grid > .inkra-radio-group {
   z-index: 2;
 }
 
-.inkra-scroll-area[data-type="always"] .inkra-scroll-area__scrollbar,
+.inkra-scroll-area[data-type="always"] .inkra-scroll-area__scrollbar { opacity: .76; pointer-events: auto; }
 .inkra-scroll-area:hover .inkra-scroll-area__scrollbar,
 .inkra-scroll-area:focus-within .inkra-scroll-area__scrollbar,
+.inkra-scroll-area__scrollbar[data-hovering],
 .inkra-scroll-area__scrollbar[data-scrolling] { opacity: 1; pointer-events: auto; }
+.inkra-scroll-area__scrollbar[data-scrolling] { transition-duration: 0ms; }
 
 .inkra-scroll-area__scrollbar[data-orientation="vertical"] {
   inset-block: 0;
@@ -5781,25 +6755,66 @@ div.inkra-choice-grid > .inkra-radio-group {
 .inkra-scroll-area__thumb,
 .inkra-scroll-area__thumb-surface {
   display: block !important;
-  pointer-events: none;
   position: absolute !important;
 }
 
-.inkra-scroll-area__track { inset: 0; opacity: .55; }
-.inkra-scroll-area__thumb { cursor: grab; min-block-size: 18px; min-inline-size: 18px; pointer-events: auto; }
+.inkra-scroll-area__track,
+.inkra-scroll-area__thumb-surface {
+  pointer-events: none;
+  transition: opacity var(--inkra-motion-fast) var(--inkra-ease);
+}
+.inkra-scroll-area__track { opacity: .34; }
+.inkra-scroll-area__thumb { cursor: grab; pointer-events: auto; }
 .inkra-scroll-area__thumb:active { cursor: grabbing; }
-.inkra-scroll-area__thumb-surface { inset: var(--inkra-scroll-area-gap); }
-.inkra-scroll-area__scrollbar[data-orientation="horizontal"] .inkra-scroll-area__thumb { min-inline-size: 24px; }
+.inkra-scroll-area__thumb-surface { opacity: .82; }
+
+.inkra-scroll-area__scrollbar[data-orientation="vertical"] .inkra-scroll-area__track {
+  inset-block: var(--inkra-scroll-area-gap);
+  inset-inline: 4px;
+}
+.inkra-scroll-area__scrollbar[data-orientation="vertical"] .inkra-scroll-area__thumb {
+  inset-inline: var(--inkra-scroll-area-gap);
+  min-block-size: 28px;
+}
+.inkra-scroll-area__scrollbar[data-orientation="vertical"] .inkra-scroll-area__thumb-surface {
+  inset-block: 2px;
+  inset-inline: 1px;
+}
+.inkra-scroll-area__scrollbar[data-orientation="horizontal"] .inkra-scroll-area__track {
+  inset-block: 4px;
+  inset-inline: var(--inkra-scroll-area-gap);
+}
+.inkra-scroll-area__scrollbar[data-orientation="horizontal"] .inkra-scroll-area__thumb {
+  inset-block: var(--inkra-scroll-area-gap);
+  min-inline-size: 32px;
+}
+.inkra-scroll-area__scrollbar[data-orientation="horizontal"] .inkra-scroll-area__thumb-surface {
+  inset-block: 1px;
+  inset-inline: 2px;
+}
+
+.inkra-scroll-area:hover .inkra-scroll-area__track,
+.inkra-scroll-area:focus-within .inkra-scroll-area__track,
+.inkra-scroll-area__scrollbar[data-hovering] .inkra-scroll-area__track,
+.inkra-scroll-area__scrollbar[data-scrolling] .inkra-scroll-area__track { opacity: .5; }
+.inkra-scroll-area:hover .inkra-scroll-area__thumb-surface,
+.inkra-scroll-area:focus-within .inkra-scroll-area__thumb-surface,
+.inkra-scroll-area__scrollbar[data-hovering] .inkra-scroll-area__thumb-surface,
+.inkra-scroll-area__scrollbar[data-scrolling] .inkra-scroll-area__thumb-surface { opacity: 1; }
+.inkra-scroll-area__scrollbar[data-scrolling] .inkra-scroll-area__track { opacity: .62; }
 .inkra-scroll-area__corner { background: transparent; }
 
 @media (prefers-reduced-motion: reduce) {
-  .inkra-scroll-area__scrollbar { transition: none; }
+  .inkra-scroll-area__scrollbar,
+  .inkra-scroll-area__track,
+  .inkra-scroll-area__thumb-surface { transition: none; }
 }
 
 @media (forced-colors: active) {
   .inkra-scroll-area__scrollbar { opacity: 1; }
-  .inkra-scroll-area__track { background: Canvas; border: 1px solid CanvasText; }
-  .inkra-scroll-area__thumb-surface { background: ButtonText; border: 2px solid ButtonText; }
+  .inkra-scroll-area__track { background: Canvas; border: 1px solid CanvasText; opacity: 1; }
+  .inkra-scroll-area__thumb-surface { background: ButtonText; border: 1px solid ButtonText; opacity: 1; }
+  .inkra-scroll-area__viewport:focus-visible { outline: 2px solid Highlight; outline-offset: -2px; }
 }
 
 @media print {
@@ -5867,6 +6882,8 @@ div.inkra-choice-grid > .inkra-radio-group {
 }
 
 .inkra-sortable__item:not([data-disabled]) { cursor: grab; }
+.inkra-sortable__item[data-handle] { cursor: auto; }
+.inkra-sortable__item:not([data-disabled]):not([data-handle]) { touch-action: none; }
 .inkra-sortable__item[data-dragging] { cursor: grabbing; z-index: 1; }
 .inkra-sortable__item:focus { outline: none; }
 
@@ -5994,6 +7011,13 @@ div.inkra-choice-grid > .inkra-radio-group {
   --inkra-field-control-height: var(--inkra-control-md);
   --inkra-field-control-font-size: var(--inkra-text-md);
   --inkra-field-control-padding: var(--inkra-space-3);
+  --inkra-tag-input-control-inset: var(--inkra-space-1);
+  --inkra-tag-input-item-height: calc(var(--inkra-field-control-height) - 2 * var(--inkra-tag-input-control-inset));
+  --inkra-tag-input-row-gap: max(
+    var(--inkra-space-1),
+    calc(var(--inkra-touch-target) - var(--inkra-tag-input-item-height))
+  );
+  --inkra-tag-input-tag-inset: var(--inkra-space-1);
 
   display: inline-grid;
   inline-size: 24rem;
@@ -6026,12 +7050,17 @@ div.inkra-choice-grid > .inkra-radio-group {
   block-size: auto;
   align-items: center;
   flex-wrap: wrap;
-  gap: var(--inkra-space-1);
-  padding: var(--inkra-space-1) var(--inkra-field-control-padding);
+  column-gap: var(--inkra-space-1);
+  row-gap: var(--inkra-tag-input-row-gap);
+  padding: var(--inkra-tag-input-control-inset) var(--inkra-field-control-padding);
   color: var(--inkra-ink);
   cursor: text;
 }
 
+.inkra-tag-input[data-has-tags="true"] .inkra-tag-input__control {
+  padding-inline: var(--inkra-tag-input-control-inset);
+}
+
 .inkra-tag-input[data-focus-within="true"] .inkra-tag-input__control > :is(.inkra-pencil-surface__ink, .inkra-pencil-surface__border) {
   filter: contrast(1.28) saturate(1.08);
 }
@@ -6042,7 +7071,8 @@ div.inkra-choice-grid > .inkra-radio-group {
   align-items: center;
   flex: 0 1 auto;
   flex-wrap: wrap;
-  gap: var(--inkra-space-1);
+  column-gap: var(--inkra-space-1);
+  row-gap: var(--inkra-tag-input-row-gap);
   margin: 0;
   padding: 0;
   list-style: none;
@@ -6052,27 +7082,22 @@ div.inkra-choice-grid > .inkra-radio-group {
 
 .inkra-tag-input__tag {
   display: inline-flex !important;
+  box-sizing: border-box;
   min-inline-size: 0;
-  min-block-size: var(--inkra-touch-target);
+  block-size: var(--inkra-tag-input-item-height);
   align-items: center;
-  overflow: hidden;
+  gap: var(--inkra-space-1);
+  padding: var(--inkra-tag-input-tag-inset);
   color: var(--inkra-ink);
   font-family: var(--inkra-font-body);
   font-size: var(--inkra-field-control-font-size);
   line-height: var(--inkra-line-ui);
 }
 
-.inkra-tag-input__tag > .inkra-pencil-surface__content {
-  display: inline-flex;
-  align-items: center;
-  min-inline-size: 0;
-}
-
 .inkra-tag-input__tag-label {
   min-inline-size: 0;
   max-inline-size: min(16rem, 50vw);
   overflow: hidden;
-  padding-inline: var(--inkra-space-3);
   text-overflow: ellipsis;
   white-space: nowrap;
 }
@@ -6080,9 +7105,9 @@ div.inkra-choice-grid > .inkra-radio-group {
 .inkra-tag-input__remove,
 .inkra-tag-input__clear {
   display: inline-flex;
+  position: relative;
   box-sizing: border-box;
   inline-size: var(--inkra-touch-target);
-  block-size: var(--inkra-touch-target);
   flex: 0 0 var(--inkra-touch-target);
   align-items: center;
   justify-content: center;
@@ -6094,7 +7119,19 @@ div.inkra-choice-grid > .inkra-radio-group {
   cursor: pointer;
 }
 
-.inkra-tag-input__remove { margin-inline-start: calc(-1 * var(--inkra-space-2)); }
+.inkra-tag-input__remove { block-size: 18px; }
+.inkra-tag-input__clear { block-size: var(--inkra-tag-input-item-height); }
+
+.inkra-tag-input__remove::before,
+.inkra-tag-input__clear::before {
+  position: absolute;
+  inset-block-start: 50%;
+  inset-inline: 0;
+  min-block-size: var(--inkra-touch-target);
+  content: "";
+  transform: translateY(-50%);
+}
+
 .inkra-tag-input__remove:hover,
 .inkra-tag-input__clear:hover { color: var(--inkra-ink); }
 
@@ -6106,20 +7143,26 @@ div.inkra-choice-grid > .inkra-radio-group {
 
 .inkra-tag-input__input {
   min-inline-size: min(8rem, 100%);
-  min-block-size: var(--inkra-touch-target);
-  block-size: var(--inkra-field-control-height);
+  min-block-size: var(--inkra-tag-input-item-height);
+  block-size: var(--inkra-tag-input-item-height);
   flex: 1 1 8rem;
   padding: 0;
   color: var(--inkra-ink);
   font-size: var(--inkra-field-control-font-size);
 }
 
+.inkra-tag-input[data-draft-empty="true"][data-has-tags="true"]:not([data-has-placeholder="true"])
+  .inkra-tag-input__input {
+  min-inline-size: 1px;
+  flex-basis: 1px;
+}
+
 .inkra-tag-input__input::placeholder {
   color: var(--inkra-ink-subtle);
   opacity: 1;
 }
 
-.inkra-tag-input__clear { margin-inline-end: calc(-1 * var(--inkra-field-control-padding)); }
+.inkra-tag-input__clear { margin-inline-end: 0; }
 
 .inkra-tag-input__underline {
   position: absolute;
@@ -6179,12 +7222,20 @@ div.inkra-choice-grid > .inkra-radio-group {
 }
 
 .inkra-transfer {
+  color: var(--inkra-ink);
+  container-name: inkra-transfer;
+  container-type: inline-size;
+  font-family: var(--inkra-font-body);
+  line-height: var(--inkra-line-ui);
+  min-width: 0;
+}
+
+.inkra-transfer__layout {
   display: grid;
   grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
   align-items: stretch;
   gap: var(--inkra-space-4);
   min-width: 0;
-  color: var(--inkra-ink);
 }
 
 .inkra-transfer__panel {
@@ -6201,9 +7252,20 @@ div.inkra-choice-grid > .inkra-radio-group {
   grid-template-rows: auto auto auto auto minmax(180px, 1fr);
 }
 
-.inkra-transfer__panel:focus-visible {
-  outline: 2px solid var(--inkra-accent-strong);
-  outline-offset: 3px;
+.inkra-transfer__panel-focus {
+  --inkra-accent-strong: var(--inkra-focus);
+
+  display: block !important;
+  inset: calc(-1 * var(--inkra-focus-offset));
+  opacity: 0;
+  pointer-events: none;
+  position: absolute !important;
+  z-index: 3;
+}
+
+.inkra-transfer__panel:focus-visible { outline: 0; }
+.inkra-transfer__panel:focus-visible > .inkra-transfer__panel-focus {
+  opacity: 1;
 }
 
 .inkra-transfer__header,
@@ -6276,40 +7338,63 @@ div.inkra-choice-grid > .inkra-radio-group {
 
 .inkra-transfer[data-disabled] { opacity: .72; }
 
-@media (max-width: 720px) {
-  .inkra-transfer { grid-template-columns: minmax(0, 1fr); }
+.inkra-transfer .inkra-transfer__direction-icon[data-direction="to-source"] { transform: scaleX(-1); }
+.inkra-transfer:dir(rtl) .inkra-transfer__direction-icon[data-direction="to-target"] { transform: scaleX(-1); }
+.inkra-transfer:dir(rtl) .inkra-transfer__direction-icon[data-direction="to-source"] { transform: none; }
+
+@container inkra-transfer (max-width: 720px) {
+  .inkra-transfer__layout { grid-template-columns: minmax(0, 1fr); }
   .inkra-transfer__panel { min-height: 320px; }
   .inkra-transfer__list { max-height: 280px; }
   .inkra-transfer__actions { grid-auto-flow: column; justify-self: center; }
-  .inkra-transfer__actions .inkra-transfer__direction-icon { transform: rotate(90deg); }
+  .inkra-transfer:dir(ltr) .inkra-transfer__direction-icon[data-direction="to-target"],
+  .inkra-transfer:dir(rtl) .inkra-transfer__direction-icon[data-direction="to-target"] {
+    transform: rotate(90deg);
+  }
+  .inkra-transfer:dir(ltr) .inkra-transfer__direction-icon[data-direction="to-source"],
+  .inkra-transfer:dir(rtl) .inkra-transfer__direction-icon[data-direction="to-source"] {
+    transform: rotate(-90deg);
+  }
 }
 
 @media (forced-colors: active) {
   .inkra-transfer__panel { border: 1px solid CanvasText; }
-  .inkra-transfer__panel:focus-visible { outline-color: Highlight; }
+  .inkra-transfer__panel:focus-visible { outline: 2px solid Highlight; outline-offset: 3px; }
+  .inkra-transfer__panel-focus { display: none !important; }
 }
 
 @media print {
-  .inkra-transfer { grid-template-columns: 1fr 1fr; }
+  .inkra-transfer__layout { grid-template-columns: 1fr 1fr; }
   .inkra-transfer__actions { display: none; }
   .inkra-transfer__panel { border: 1px solid currentColor; }
 }
 
 
 .inkra-tree-select {
-  display: block;
+  --inkra-tree-select-control-height: var(--inkra-control-md);
+
+  display: flex;
+  align-items: center;
+  min-height: var(--inkra-touch-target);
   min-width: 0;
   width: 100%;
   color: var(--inkra-ink);
 }
 
-.inkra-tree-select__control {
-  display: grid;
-  grid-template-columns: minmax(0, 1fr) auto;
-  gap: var(--inkra-space-2);
+.inkra-tree-select[data-size="sm"] { --inkra-tree-select-control-height: var(--inkra-control-sm); }
+.inkra-tree-select[data-size="lg"] { --inkra-tree-select-control-height: var(--inkra-control-lg); }
+
+.inkra-button-group.inkra-tree-select__control {
+  align-items: center;
+  block-size: var(--inkra-tree-select-control-height);
   min-width: 0;
+  overflow: visible;
+  width: 100%;
 }
 
+.inkra-tree-select__control > .inkra-tree-select__trigger { flex: 1 1 auto; }
+.inkra-tree-select__control > .inkra-tree-select__clear { flex: 0 0 auto; }
+
 .inkra-tree-select__trigger,
 .inkra-tree-select__trigger > .inkra-button__surface {
   min-width: 0;
@@ -6335,10 +7420,24 @@ div.inkra-choice-grid > .inkra-radio-group {
   color: var(--inkra-ink-subtle);
 }
 
-.inkra-tree-select__clear[data-visible="false"] {
+.inkra-tree-select__clear[aria-hidden="true"] {
   visibility: hidden;
 }
 
+.inkra-tree-select__control .inkra-button-group__divider[data-orientation="vertical"] {
+  block-size: var(--inkra-tree-select-control-height);
+  inset-block-start: 50%;
+  transform: translateY(-50%);
+}
+
+.inkra-tree-select[data-invalid] {
+  color: var(--inkra-danger);
+}
+
+.inkra-tree-select[data-invalid] .inkra-tree-select__control {
+  --inkra-accent-strong: var(--inkra-danger);
+}
+
 .inkra-tree-select__popover {
   width: max(var(--radix-popover-trigger-width, 18rem), 18rem);
   max-width: min(32rem, calc(100vw - var(--inkra-space-4)));
@@ -6383,6 +7482,11 @@ div.inkra-choice-grid > .inkra-radio-group {
 }
 
 @media (forced-colors: active) {
+  .inkra-tree-select[data-invalid] .inkra-tree-select__control {
+    outline: 2px solid Mark;
+    outline-offset: 2px;
+  }
+
   .inkra-tree-select__popover {
     border: 1px solid CanvasText;
   }
@@ -6454,105 +7558,504 @@ div.inkra-choice-grid > .inkra-radio-group {
   }
 }
 
-@media print {
-  .inkra-typewriter__grapheme,
-  .inkra-typewriter__space {
-    visibility: visible;
-  }
+@media print {
+  .inkra-typewriter__grapheme,
+  .inkra-typewriter__space {
+    visibility: visible;
+  }
+}
+
+.inkra-virtual-list__frame {
+  min-inline-size: 0;
+  position: relative;
+}
+
+.inkra-virtual-list__focus {
+  position: absolute;
+  inset: 0;
+  opacity: 0;
+  pointer-events: none;
+}
+
+.inkra-virtual-list__frame:has(> .inkra-virtual-list:focus-visible) > .inkra-virtual-list__focus {
+  opacity: 1;
+}
+
+.inkra-virtual-list {
+  block-size: 20rem;
+  color: var(--inkra-ink);
+  min-block-size: 8rem;
+  min-inline-size: 0;
+  outline: 0;
+  overflow: auto;
+  overscroll-behavior: contain;
+  position: relative;
+  scrollbar-gutter: stable;
+}
+
+.inkra-virtual-list[data-external-scroll="true"] {
+  block-size: auto;
+  min-block-size: 0;
+  overflow: visible;
+  scrollbar-gutter: auto;
+}
+
+.inkra-virtual-list:focus-visible {
+  outline: none;
+}
+
+.inkra-virtual-list__items {
+  inline-size: 100%;
+  list-style: none;
+  margin: 0;
+  min-inline-size: 0;
+  padding: 0;
+  position: relative;
+}
+
+.inkra-virtual-list[data-virtualized="true"] .inkra-virtual-list__item {
+  inset-block-start: 0;
+  inset-inline-start: 0;
+  position: absolute;
+}
+
+.inkra-virtual-list__item {
+  box-sizing: border-box;
+  inline-size: 100%;
+  min-block-size: var(--inkra-touch-target);
+  min-inline-size: 0;
+  overflow-wrap: anywhere;
+  padding: var(--inkra-space-2) var(--inkra-space-3);
+  position: relative;
+  will-change: transform;
+}
+
+.inkra-virtual-list:not([data-virtualized="true"]) .inkra-virtual-list__item {
+  will-change: auto;
+}
+
+.inkra-virtual-list__item > .inkra-virtual-list__separator {
+  color: var(--inkra-border);
+  inset-block-start: -4px;
+  inset-inline: var(--inkra-space-3);
+  inline-size: auto;
+  opacity: .58;
+  position: absolute;
+  width: auto;
+}
+
+.inkra-virtual-list__empty {
+  color: var(--inkra-ink-muted);
+  display: grid;
+  min-block-size: 8rem;
+  padding: var(--inkra-space-6);
+  place-items: center;
+  text-align: center;
+}
+
+@media (forced-colors: active) {
+  .inkra-virtual-list__frame { border: 1px solid CanvasText; }
+  .inkra-virtual-list:focus-visible {
+    outline: var(--inkra-focus-width) solid Highlight;
+    outline-color: Highlight;
+    outline-offset: calc(-1 * var(--inkra-focus-width));
+  }
+  .inkra-virtual-list__item > .inkra-virtual-list__separator {
+    inset-block-start: 0;
+    opacity: 1;
+  }
+}
+
+@media print {
+  .inkra-virtual-list {
+    block-size: auto !important;
+    overflow: visible;
+  }
+
+  .inkra-virtual-list__item > .inkra-virtual-list__separator {
+    inset-block-start: 0;
+    opacity: 1;
+  }
+}
+
+.inkra-markdown {
+  color: var(--inkra-ink);
+  font-family: var(--inkra-font-body);
+  font-size: var(--inkra-text-md);
+  line-height: var(--inkra-line-body);
+  max-width: 100%;
+  min-width: 0;
+  overflow-wrap: anywhere;
+}
+
+.inkra-markdown > :first-child { margin-block-start: 0; }
+.inkra-markdown > :last-child { margin-block-end: 0; }
+
+.inkra-markdown__heading {
+  color: var(--inkra-ink);
+  font-weight: var(--inkra-weight-regular);
+  letter-spacing: 0;
+  line-height: 1.25;
+  margin-block: var(--inkra-space-6) var(--inkra-space-3);
+}
+
+.inkra-markdown h1 { font-size: var(--inkra-text-3xl); }
+.inkra-markdown h2 { font-size: var(--inkra-text-2xl); }
+.inkra-markdown h3 { font-size: var(--inkra-text-xl); }
+.inkra-markdown h4 { font-size: var(--inkra-text-lg); }
+.inkra-markdown h5 { font-size: var(--inkra-text-md); }
+.inkra-markdown h6 { color: var(--inkra-ink-muted); font-size: var(--inkra-text-sm); }
+
+.inkra-markdown__paragraph {
+  margin-block: 0 var(--inkra-space-4);
+}
+
+.inkra-markdown strong { color: var(--inkra-ink); font-weight: var(--inkra-weight-semibold); }
+.inkra-markdown em { color: var(--inkra-ink-muted); font-style: italic; }
+.inkra-markdown del { color: var(--inkra-ink-muted); text-decoration-thickness: 1px; }
+
+.inkra-markdown__deleted {
+  display: inline-block;
+  max-width: 100%;
+  position: relative;
+  vertical-align: baseline;
+}
+.inkra-markdown__deleted[data-pencil-strike-ready="true"] { text-decoration: none; }
+.inkra-markdown__deleted:not([data-pencil-strike-ready="true"]) .inkra-pencil-text { text-decoration: line-through; }
+.inkra-markdown__deleted > .inkra-markdown__strike {
+  height: 6px;
+  pointer-events: none;
+  position: absolute;
+}
+
+.inkra-markdown__link {
+  color: var(--inkra-accent-strong);
+  display: inline-block;
+  max-width: 100%;
+  position: relative;
+  text-decoration: none;
+  vertical-align: baseline;
+}
+
+.inkra-markdown__link > span { max-width: 100%; }
+.inkra-markdown__link > .inkra-markdown__link-line {
+  bottom: 0;
+  height: 5px;
+  inset-inline: 0;
+  pointer-events: none;
+  position: absolute;
+  width: 100%;
+}
+.inkra-markdown__link:focus-visible { outline: 0; }
+.inkra-pencil-surface.inkra-markdown__link-focus,
+.inkra-pencil-surface.inkra-markdown__code-focus,
+.inkra-pencil-surface.inkra-markdown__table-focus {
+  --inkra-accent-strong: var(--inkra-focus);
+  display: block;
+  opacity: 0;
+  pointer-events: none;
+  position: absolute;
+  z-index: 2;
+}
+.inkra-pencil-surface.inkra-markdown__link-focus { inset: -2px; }
+.inkra-markdown__link:focus-visible > .inkra-markdown__link-focus { opacity: 1; }
+.inkra-markdown__link-text,
+.inkra-markdown__image-alt { color: var(--inkra-ink-muted); }
+
+.inkra-markdown__list {
+  margin-block: 0 var(--inkra-space-4);
+  padding-inline-start: 1.65rem;
+}
+
+.inkra-markdown__list--unordered,
+.inkra-markdown__list--ordered { list-style: none; padding-inline-start: 0; }
+.inkra-markdown__list--ordered { font-variant-numeric: tabular-nums; }
+
+.inkra-markdown__list-item {
+  margin-block: var(--inkra-space-1);
+  min-width: 0;
+}
+
+.inkra-markdown__list--unordered > .inkra-markdown__list-item,
+.inkra-markdown__list--ordered > .inkra-markdown__list-item {
+  align-items: flex-start;
+  display: grid;
+  gap: var(--inkra-space-2);
+  grid-template-columns: 14px minmax(0, 1fr);
+}
+
+.inkra-markdown__list--ordered > .inkra-markdown__list-item { grid-template-columns: var(--inkra-markdown-ordered-marker-width, 1.75rem) minmax(0, 1fr); }
+.inkra-markdown__list--unordered > .task-list-item { grid-template-columns: minmax(0, 1fr); }
+.inkra-markdown__bullet { color: var(--inkra-accent-strong); margin-block-start: 0.42em; }
+.inkra-markdown__ordered-marker {
+  align-self: start;
+  color: var(--inkra-accent-strong);
+  justify-self: end;
+  line-height: var(--inkra-line-body);
+  max-width: none;
+  text-align: end;
+  white-space: nowrap;
+  width: 100%;
+}
+.inkra-markdown__list-content { grid-column: 2; min-width: 0; }
+.inkra-markdown__list--unordered > .task-list-item > .inkra-markdown__list-content { grid-column: 1; }
+.inkra-markdown__list-content > :last-child { margin-block-end: 0; }
+.inkra-markdown .contains-task-list { list-style: none; padding-inline-start: 0; }
+.inkra-markdown__list--unordered > .task-list-item { list-style: none; }
+.inkra-markdown__task-row {
+  align-items: start;
+  display: grid;
+  gap: var(--inkra-space-2);
+  grid-template-columns: 18px minmax(0, 1fr);
+}
+.inkra-markdown__task-content { min-width: 0; }
+.inkra-markdown__task-content > :last-child { margin-block-end: 0; }
+
+.inkra-selection-control.inkra-markdown__task-checkbox {
+  align-items: center;
+  cursor: default;
+  display: inline-grid;
+  gap: 0;
+  grid-template-columns: 18px;
+  inline-size: 18px;
+  margin-block-start: 0.18em;
+  margin-inline-end: 0;
+  min-height: 0;
+  opacity: 1;
+  vertical-align: -0.18em;
+}
+.inkra-markdown__task-checkbox > .inkra-selection-control__copy { display: none; }
+.inkra-markdown__task-checkbox > .inkra-selection-control__mark {
+  align-items: center;
+  block-size: 18px;
+  display: inline-flex;
+  inline-size: 18px;
+  justify-content: center;
+}
+
+.inkra-markdown__quote {
+  color: var(--inkra-ink-muted);
+  display: grid;
+  gap: var(--inkra-space-3);
+  grid-template-columns: 8px minmax(0, 1fr);
+  margin: 0 0 var(--inkra-space-4);
+  padding: var(--inkra-space-2) 0;
+}
+
+.inkra-markdown__quote-line { min-height: 100%; }
+.inkra-markdown__quote :last-child { margin-block-end: 0; }
+
+.inkra-markdown__divider { margin-block: var(--inkra-space-6); }
+
+.inkra-markdown :not(pre) > .inkra-markdown__code {
+  background: transparent;
+  border-radius: var(--inkra-radius-sm);
+  color: var(--inkra-selection-foreground);
+  display: inline-block;
+  font-family: var(--inkra-font-mono);
+  font-size: 0.9em;
+  isolation: isolate;
+  max-width: 100%;
+  padding: 0.12em 0.4em;
+  position: relative;
+  vertical-align: baseline;
+}
+
+.inkra-markdown__code > .inkra-pencil-surface.inkra-markdown__code-wash {
+  --inkra-accent: var(--inkra-selection-pigment);
+  border-radius: 3px;
+  display: block;
+  inset: 0;
+  overflow: hidden;
+  pointer-events: none;
+  position: absolute;
+  z-index: -1;
+}
+.inkra-markdown__code-wash[data-pencil-fallback="true"] { background: var(--inkra-selection); }
+
+.inkra-markdown__code-text {
+  --inkra-letter-fill: 0.24;
+  --inkra-letter-grain: 0.34;
+  --inkra-letter-outline: 0.84;
+  font-family: inherit;
+}
+
+.inkra-markdown__code-text > .inkra-pencil-text__source { font-family: inherit; }
+
+.inkra-markdown__code-frame {
+  margin-block: 0 var(--inkra-space-4);
+  max-width: 100%;
+  min-width: 0;
+  position: relative;
+}
+
+.inkra-markdown__code-frame > .inkra-markdown__code-header {
+  padding: var(--inkra-space-2) var(--inkra-space-4);
+}
+.inkra-markdown__code-language {
+  align-items: center;
+  display: flex;
+  gap: var(--inkra-space-2);
+  font-size: var(--inkra-text-sm);
+  min-width: 0;
+}
+.inkra-markdown__code-language > .inkra-pencil-icon { flex: none; }
+.inkra-markdown__code-status {
+  clip-path: inset(50%);
+  height: 1px;
+  overflow: hidden;
+  position: absolute;
+  white-space: nowrap;
+  width: 1px;
 }
 
-.inkra-virtual-list {
-  block-size: 20rem;
+.inkra-markdown__code-surface {
+  background: transparent;
   color: var(--inkra-ink);
-  min-block-size: 8rem;
-  min-inline-size: 0;
-  outline: 0;
-  overflow: auto;
-  overscroll-behavior: contain;
-  position: relative;
-  scrollbar-gutter: stable;
+  font-family: "Trip Map Hand", var(--inkra-font-hand);
+  font-size: var(--inkra-text-md);
+  font-weight: var(--inkra-weight-regular);
+  line-height: 1.8;
+  margin: 0;
+  max-width: 100%;
+  min-width: 0;
+  overflow-x: auto;
+  overflow-wrap: normal;
+  overscroll-behavior-inline: contain;
+  padding: var(--inkra-space-4);
+  tab-size: 2;
+  white-space: pre;
 }
 
-.inkra-virtual-list[data-external-scroll="true"] {
-  block-size: auto;
-  min-block-size: 0;
-  overflow: visible;
-  scrollbar-gutter: auto;
+.inkra-markdown__code-surface:focus-visible {
+  outline: 0;
 }
+.inkra-markdown__code-focus { inset: 0; }
+.inkra-markdown__code-surface:focus-visible + .inkra-markdown__code-focus { opacity: 1; }
 
-.inkra-virtual-list:focus-visible {
-  outline: var(--inkra-focus-width) solid var(--inkra-focus);
-  outline-offset: calc(-1 * var(--inkra-focus-width));
+.inkra-markdown__code-surface > .inkra-markdown__code {
+  color: var(--inkra-ink);
+  font: inherit;
+  overflow-wrap: normal;
+  white-space: pre;
 }
 
-.inkra-virtual-list__items {
-  inline-size: 100%;
-  list-style: none;
-  margin: 0;
-  min-inline-size: 0;
-  padding: 0;
+.inkra-markdown__code-surface .inkra-pencil-text,
+.inkra-markdown__code-surface .inkra-pencil-text__source {
+  max-width: none;
+  overflow-wrap: normal;
+  white-space: pre;
+}
+
+.inkra-markdown__code-surface .token-comment,
+.inkra-markdown__code-surface .token-prolog { color: var(--inkra-ink-muted); }
+.inkra-markdown__code-surface .token-keyword,
+.inkra-markdown__code-surface .token-tag { color: var(--inkra-danger); }
+.inkra-markdown__code-surface .token-function,
+.inkra-markdown__code-surface .token-class-name,
+.inkra-markdown__code-surface .token-attr-name,
+.inkra-markdown__code-surface .token-property { color: var(--inkra-info-foreground); }
+.inkra-markdown__code-surface .token-string,
+.inkra-markdown__code-surface .token-attr-value { color: var(--inkra-success-foreground); }
+.inkra-markdown__code-surface .token-number,
+.inkra-markdown__code-surface .token-boolean { color: var(--inkra-warning-foreground); }
+.inkra-markdown__code-surface .token-punctuation,
+.inkra-markdown__code-surface .token-operator { color: var(--inkra-ink); }
+
+.inkra-markdown__table-frame {
+  margin-block: 0 var(--inkra-space-4);
+  max-width: 100%;
+  min-width: 0;
   position: relative;
 }
 
-.inkra-virtual-list[data-virtualized="true"] .inkra-virtual-list__item {
-  inset-block-start: 0;
-  inset-inline-start: 0;
-  position: absolute;
+.inkra-markdown__table {
+  margin: 0;
+  max-width: 100%;
+  overscroll-behavior-inline: contain;
 }
 
-.inkra-virtual-list__item {
-  box-sizing: border-box;
-  inline-size: 100%;
-  min-block-size: var(--inkra-touch-target);
-  min-inline-size: 0;
-  overflow-wrap: anywhere;
-  padding: var(--inkra-space-2) var(--inkra-space-3);
-  position: relative;
-  will-change: transform;
-}
+.inkra-markdown .inkra-markdown__table:focus-visible { outline: 0; }
+.inkra-markdown__table-focus { inset: 0; }
+.inkra-markdown__table:focus-visible + .inkra-markdown__table-focus { opacity: 1; }
 
-.inkra-virtual-list:not([data-virtualized="true"]) .inkra-virtual-list__item {
-  will-change: auto;
+.inkra-markdown__image-frame {
+  display: inline-block;
+  margin-block: var(--inkra-space-2);
+  max-width: 100%;
+  padding: var(--inkra-space-1);
 }
 
-.inkra-virtual-list__item > .inkra-virtual-list__separator {
-  color: var(--inkra-border);
-  inset-block-start: -4px;
-  inset-inline: var(--inkra-space-3);
-  inline-size: auto;
-  opacity: .58;
-  position: absolute;
-  width: auto;
+.inkra-markdown__image {
+  display: block;
+  height: auto;
+  max-width: 100%;
 }
 
-.inkra-virtual-list__empty {
-  color: var(--inkra-ink-muted);
-  display: grid;
-  min-block-size: 8rem;
-  padding: var(--inkra-space-6);
-  place-items: center;
-  text-align: center;
+@media (max-width: 520px) {
+  .inkra-markdown__heading { overflow-wrap: anywhere; }
+  .inkra-markdown__code-surface { padding: var(--inkra-space-3); }
 }
 
 @media (forced-colors: active) {
-  .inkra-virtual-list { border: 1px solid CanvasText; }
-  .inkra-virtual-list:focus-visible { outline-color: Highlight; }
-  .inkra-virtual-list__item > .inkra-virtual-list__separator {
-    inset-block-start: 0;
-    opacity: 1;
-  }
+  .inkra-markdown__link { text-decoration: underline; }
+  .inkra-markdown__link:focus-visible,
+  .inkra-markdown__code-surface:focus-visible,
+  .inkra-markdown .inkra-markdown__table:focus-visible {
+    outline: var(--inkra-focus-width) solid Highlight;
+    outline-offset: calc(-1 * var(--inkra-focus-width));
+  }
+  .inkra-pencil-surface.inkra-markdown__link-focus,
+  .inkra-pencil-surface.inkra-markdown__code-focus,
+  .inkra-pencil-surface.inkra-markdown__table-focus { display: none !important; }
+  .inkra-markdown__link-line,
+  .inkra-markdown__bullet,
+  .inkra-markdown__ordered-marker { display: none; }
+  .inkra-markdown .inkra-markdown__list--unordered { list-style: disc; padding-inline-start: 1.4rem; }
+  .inkra-markdown .inkra-markdown__list--ordered { list-style: decimal; padding-inline-start: 1.8rem; }
+  .inkra-markdown__list--unordered > .inkra-markdown__list-item,
+  .inkra-markdown__list--ordered > .inkra-markdown__list-item { display: list-item; }
+  .inkra-markdown__list--unordered > .task-list-item { list-style: none; }
+  .inkra-markdown__list-content { grid-column: auto; }
+  .inkra-markdown :not(pre) > .inkra-markdown__code { background: Canvas; border: 1px solid CanvasText; color: CanvasText; }
+  .inkra-markdown__code-surface,
+  .inkra-markdown__code-surface .inkra-pencil-text { color: CanvasText; }
+  .inkra-markdown__task-checkbox > .inkra-selection-control__input { height: 18px; width: 18px; }
 }
 
 @media print {
-  .inkra-virtual-list {
-    block-size: auto !important;
-    overflow: visible;
-  }
-
-  .inkra-virtual-list__item > .inkra-virtual-list__separator {
-    inset-block-start: 0;
+  .inkra-markdown__link { color: currentcolor; text-decoration: underline; }
+  .inkra-pencil-surface.inkra-markdown__link-focus,
+  .inkra-pencil-surface.inkra-markdown__code-focus,
+  .inkra-pencil-surface.inkra-markdown__table-focus { display: none !important; }
+  .inkra-markdown__link-line,
+  .inkra-markdown__bullet,
+  .inkra-markdown__ordered-marker { display: none; }
+  .inkra-markdown .inkra-markdown__list--unordered { list-style: disc; padding-inline-start: 1.4rem; }
+  .inkra-markdown .inkra-markdown__list--ordered { list-style: decimal; padding-inline-start: 1.8rem; }
+  .inkra-markdown__list--unordered > .inkra-markdown__list-item,
+  .inkra-markdown__list--ordered > .inkra-markdown__list-item { display: list-item; }
+  .inkra-markdown__list--unordered > .task-list-item { list-style: none; }
+  .inkra-markdown__list-content { grid-column: auto; }
+  .inkra-markdown__code-frame { border: 1px solid currentcolor; }
+  .inkra-markdown__code-header { border-bottom: 1px solid currentcolor; }
+  .inkra-markdown__code-header .inkra-card__action { display: none; }
+  .inkra-markdown__code-surface .inkra-pencil-text { color: currentcolor; }
+  .inkra-markdown__task-checkbox > .inkra-selection-control__input {
+    appearance: auto;
+    height: 18px;
     opacity: 1;
+    position: static;
+    width: 18px;
+    z-index: auto;
   }
+  .inkra-markdown__task-checkbox > .inkra-selection-control__mark { display: none !important; }
+}
+
+@media print, (forced-colors: active) {
+  .inkra-markdown__deleted[data-pencil-strike-ready="true"],
+  .inkra-markdown__deleted .inkra-pencil-text { text-decoration: line-through; }
+  .inkra-markdown__deleted > .inkra-markdown__strike { display: none; }
 }
 
 /* required styles */
@@ -7280,6 +8783,14 @@ svg.leaflet-image-layer.leaflet-interactive path {
   .inkra-calendar__accessory { top: 46px; inset-inline: 0; margin: auto; max-width: 100%; }
 }
 
+/* Opt-in summaries remain operable at every width. The legacy responsive
+   clipping must not hide a disclosure or events the user explicitly revealed. */
+.inkra-calendar__events-toggle { pointer-events: auto; min-width: 0; max-width: 100%; white-space: normal; }
+.inkra-calendar__events-toggle .inkra-button__label { min-width: 0; white-space: normal; overflow-wrap: anywhere; }
+.inkra-calendar-scroll[data-event-summary] .inkra-calendar__events { display: grid; }
+.inkra-calendar-scroll[data-event-summary] .inkra-calendar__event-card:nth-child(n + 3) { display: block; }
+.inkra-calendar-scroll[data-event-summary] .inkra-calendar__day-card { padding: 44px 5px 8px; }
+
 .inkra-agenda { display: flex; flex-direction: column; gap: 12px; min-width: 0; height: 100%; color: var(--inkra-ink); }
 .inkra-agenda__heading { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 8px; flex: none; }
 .inkra-agenda__heading h3 { margin: 0; font-size: 20px; font-weight: 400; }
@@ -7334,23 +8845,47 @@ svg.leaflet-image-layer.leaflet-interactive path {
 .inkra-toast__theme-anchor { display: none; }
 
 .inkra-toast__viewport {
+  --inkra-toast-enter-x: 0px;
+  --inkra-toast-enter-y: 12px;
+  --inkra-toast-edge: var(--inkra-space-5);
+  --inkra-toast-start: max(var(--inkra-toast-edge), env(safe-area-inset-left));
+  --inkra-toast-end: max(var(--inkra-toast-edge), env(safe-area-inset-right));
   display: flex;
   flex-direction: column;
   gap: var(--inkra-space-3);
-  inset-block: auto var(--inkra-space-5);
-  inset-inline: auto var(--inkra-space-5);
+  inset-block: auto max(var(--inkra-toast-edge), env(safe-area-inset-bottom));
+  inset-inline: auto var(--inkra-toast-end);
   margin: 0;
   max-height: calc(100dvh - var(--inkra-space-10));
   max-width: calc(100vw - var(--inkra-space-10));
   outline: 0;
-  padding: 0;
+  padding: 4px;
+  box-sizing: border-box;
+  pointer-events: none;
+  overflow: auto;
   position: fixed;
-  width: min(24rem, calc(100vw - var(--inkra-space-10)));
+  width: min(24rem, calc(100vw - 2 * var(--inkra-toast-edge)));
   z-index: calc(var(--inkra-z-toast, 50) + var(--inkra-floating-layer-offset, 0));
 }
 
-.inkra-toast__viewport[data-placement^="top"] { inset-block: var(--inkra-space-5) auto; }
-.inkra-toast__viewport[data-placement$="start"] { inset-inline: var(--inkra-space-5) auto; }
+.inkra-toast__viewport[data-placement^="top"] { inset-block: max(var(--inkra-toast-edge), env(safe-area-inset-top)) auto; --inkra-toast-enter-y: -12px; }
+.inkra-toast__viewport[data-placement^="bottom"] { flex-direction: column-reverse; }
+.inkra-toast__viewport:dir(rtl) { --inkra-toast-start: max(var(--inkra-toast-edge), env(safe-area-inset-right)); --inkra-toast-end: max(var(--inkra-toast-edge), env(safe-area-inset-left)); }
+.inkra-toast__viewport[data-placement$="start"] { inset-inline: var(--inkra-toast-start) auto; align-items: flex-start; }
+.inkra-toast__viewport[data-placement$="end"] { align-items: flex-end; }
+.inkra-toast__viewport:is([data-placement="top-center"], [data-placement="bottom-center"], [data-placement="center"]) {
+  inset-inline: auto;
+  left: 50%;
+  right: auto;
+  transform: translateX(-50%);
+  align-items: center;
+}
+.inkra-toast__viewport[data-placement^="center"] { top: 50%; bottom: auto; transform: translateY(-50%); --inkra-toast-enter-y: 0px; }
+.inkra-toast__viewport[data-placement="center"] { transform: translate(-50%, -50%); --inkra-toast-enter-y: 8px; }
+.inkra-toast__viewport[data-placement="center-start"] { --inkra-toast-enter-x: -12px; }
+.inkra-toast__viewport[data-placement="center-end"] { --inkra-toast-enter-x: 12px; }
+.inkra-toast__viewport:dir(rtl)[data-placement="center-start"] { --inkra-toast-enter-x: 12px; }
+.inkra-toast__viewport:dir(rtl)[data-placement="center-end"] { --inkra-toast-enter-x: -12px; }
 
 .inkra-toast__root {
   --inkra-toast-translate-x: var(--toast-swipe-movement-x, 0px);
@@ -7359,6 +8894,9 @@ svg.leaflet-image-layer.leaflet-interactive path {
   color: var(--inkra-toast-foreground, var(--inkra-ink));
   max-width: 100%;
   min-width: 0;
+  flex: 0 0 auto;
+  width: 100%;
+  pointer-events: auto;
   position: relative;
   transform: translate(var(--inkra-toast-translate-x), var(--inkra-toast-translate-y));
   transition: opacity var(--inkra-motion-normal) var(--inkra-ease), transform var(--inkra-motion-normal) var(--inkra-ease);
@@ -7368,7 +8906,12 @@ svg.leaflet-image-layer.leaflet-interactive path {
 .inkra-toast__root[data-ending-style],
 .inkra-toast__root[data-limited] { opacity: 0; }
 
-.inkra-toast__root[data-starting-style] { transform: translateY(8px); }
+.inkra-toast__root[data-limited] { position: absolute; visibility: hidden; pointer-events: none; }
+.inkra-toast__root:focus-visible { outline: 0; }
+.inkra-toast__focus.inkra-pencil-surface { --inkra-accent-strong: var(--inkra-focus); display: none; position: absolute; inset: -3px; pointer-events: none; z-index: 2; }
+.inkra-toast__root:focus-visible > .inkra-toast__focus { display: block; }
+.inkra-toast__root[data-starting-style],
+.inkra-toast__root[data-ending-style] { transform: translate(var(--inkra-toast-enter-x), var(--inkra-toast-enter-y)); }
 .inkra-toast__root[data-ending-style][data-swipe-direction="left"] { transform: translateX(-110%); }
 .inkra-toast__root[data-ending-style][data-swipe-direction="right"] { transform: translateX(110%); }
 .inkra-toast__root[data-ending-style][data-swipe-direction="up"] { transform: translateY(-110%); }
@@ -7400,10 +8943,21 @@ svg.leaflet-image-layer.leaflet-interactive path {
   position: absolute;
   z-index: 0;
 }
+.inkra-toast__wash { inset: 0; position: absolute; z-index: 0; --inkra-selection-pigment: var(--inkra-accent-soft); }
+.inkra-toast__root[data-tone="neutral"] .inkra-toast__wash { --inkra-selection-pigment: var(--inkra-ink-muted); opacity: .5; }
+
+.inkra-toast__root[data-variant="compact"] { width: fit-content; border-radius: var(--inkra-radius-md); }
+.inkra-toast__root[data-variant="compact"] .inkra-toast__surface { border-radius: inherit; overflow: hidden; }
+.inkra-toast__root[data-variant="compact"] .inkra-toast__surface[data-pencil-fallback="true"] { border: 0; }
+.inkra-toast__root[data-variant="compact"] .inkra-toast__content { align-items: center; padding: var(--inkra-space-1) var(--inkra-space-3); gap: var(--inkra-space-2); }
+.inkra-toast__root[data-variant="compact"] .inkra-toast__title { font-size: var(--inkra-text-md); }
+.inkra-toast__root[data-variant="compact"] .inkra-toast__copy { gap: 2px; flex-basis: 0; }
+.inkra-toast__root[data-variant="card"] .inkra-toast__copy { flex-basis: 120px; }
 
 .inkra-toast__content {
   align-items: flex-start;
   display: flex;
+  flex-wrap: wrap;
   gap: var(--inkra-space-3);
   justify-content: space-between;
   min-height: var(--inkra-control-md);
@@ -7417,26 +8971,35 @@ svg.leaflet-image-layer.leaflet-interactive path {
 .inkra-toast__title { font-size: var(--inkra-text-lg); line-height: var(--inkra-line-ui); margin: 0; overflow-wrap: anywhere; }
 .inkra-toast__description { color: var(--inkra-toast-foreground, var(--inkra-ink-muted)); font-size: var(--inkra-text-sm); line-height: var(--inkra-line-body); margin: 0; overflow-wrap: anywhere; }
 .inkra-toast__actions { align-items: center; display: flex; flex: none; gap: var(--inkra-space-1); }
+.inkra-toast__actions { max-width: 100%; flex-wrap: wrap; margin-inline-start: auto; }
+.inkra-toast__action { max-width: 100%; }
+.inkra-toast__action .inkra-button__surface { height: auto; min-height: var(--inkra-button-visual-height); max-width: 100%; padding-block: var(--inkra-space-2); }
+.inkra-toast__action > .inkra-button__focus-ring { height: calc(100% + 2 * var(--inkra-focus-offset)); }
+.inkra-toast__action .inkra-button__label,
+.inkra-toast__action .inkra-pencil-text,
+.inkra-toast__action .inkra-pencil-text__source { min-inline-size: 0; white-space: normal; overflow-wrap: anywhere; }
 .inkra-toast__action,
 .inkra-toast__close { position: relative; z-index: 1; }
 
 @media (max-width: 30rem) {
   .inkra-toast__viewport {
-    inset-inline: var(--inkra-space-4);
-    max-width: none;
-    width: auto;
+    --inkra-toast-edge: var(--inkra-space-3);
+    max-width: calc(100vw - 2 * var(--inkra-toast-edge));
   }
-  .inkra-toast__content { align-items: stretch; flex-direction: column; }
+  .inkra-toast__content { flex-wrap: wrap; }
+  .inkra-toast__copy { flex-basis: 120px; }
   .inkra-toast__actions { justify-content: flex-end; }
 }
 
 @media (prefers-reduced-motion: reduce) {
   .inkra-toast__root { transition: none; }
+  .inkra-toast__root[data-starting-style], .inkra-toast__root[data-ending-style] { transform: none; }
 }
 
 @media (forced-colors: active) {
-  .inkra-toast__surface { display: none; }
+  .inkra-toast__surface, .inkra-toast__wash, .inkra-toast__focus.inkra-pencil-surface { display: none !important; }
   .inkra-toast__root { border: 1px solid CanvasText; background: Canvas; color: CanvasText; forced-color-adjust: none; }
+  .inkra-toast__root:focus-visible { outline: var(--inkra-focus-width) solid Highlight; outline-offset: 0; }
   .inkra-toast__description { color: CanvasText; }
 }
 
@@ -7447,6 +9010,7 @@ svg.leaflet-image-layer.leaflet-interactive path {
   color: var(--inkra-ink);
   display: grid;
   gap: var(--inkra-space-2);
+  grid-template-columns: minmax(0, 1fr);
   justify-items: var(--inkra-empty-align, center);
   min-width: 0;
   padding: var(--inkra-empty-padding, var(--inkra-space-6));
@@ -7469,8 +9033,47 @@ svg.leaflet-image-layer.leaflet-interactive path {
   min-height: 2rem;
   min-width: 2rem;
 }
-.inkra-empty[data-size="sm"] .inkra-empty__icon { min-height: 1.5rem; min-width: 1.5rem; }
-.inkra-empty[data-size="lg"] .inkra-empty__icon { min-height: 2.5rem; min-width: 2.5rem; }
+.inkra-empty[data-size="sm"] .inkra-empty__icon:not([data-illustration]) { min-height: 1.5rem; min-width: 1.5rem; }
+.inkra-empty[data-size="lg"] .inkra-empty__icon:not([data-illustration]) { min-height: 2.5rem; min-width: 2.5rem; }
+
+.inkra-empty { --inkra-empty-illustration-size: 160px; }
+.inkra-empty[data-size="sm"] { --inkra-empty-illustration-size: 112px; }
+.inkra-empty[data-size="lg"] { --inkra-empty-illustration-size: 192px; }
+.inkra-empty__icon[data-illustration] {
+  width: var(--inkra-empty-icon-size, var(--inkra-empty-illustration-size, 160px));
+  max-width: 100%;
+  min-width: 0;
+  min-height: 0;
+}
+.inkra-empty__illustration {
+  aspect-ratio: 1;
+  display: block;
+  flex: 1;
+  min-width: 0;
+  pointer-events: none;
+  position: relative;
+}
+.inkra-empty__illustration-layer,
+.inkra-empty__illustration-fallback {
+  position: absolute;
+  inset: 0;
+  width: 100%;
+  height: 100%;
+}
+.inkra-empty__illustration-layer--accent { color: var(--inkra-accent); }
+.inkra-empty__illustration-layer > .inkra-pencil-icon {
+  width: 100% !important;
+  height: 100% !important;
+}
+.inkra-empty__illustration-layer > [data-pencil-icon-ready] + svg { display: none; }
+.inkra-empty__illustration-layer > canvas:not([data-pencil-icon-ready]) { visibility: hidden; }
+@media (forced-colors: active), print {
+  .inkra-empty__illustration-layer > .inkra-pencil-icon { display: none; }
+  .inkra-empty__illustration-layer > [data-pencil-icon-ready] + svg { display: block; }
+}
+@media (forced-colors: active) {
+  .inkra-empty__illustration-layer--accent { color: CanvasText; }
+}
 
 .inkra-empty__title {
   font-size: var(--inkra-text-xl);
@@ -7632,7 +9235,7 @@ svg.leaflet-image-layer.leaflet-interactive path {
 .inkra-alert-dialog__content {
   animation: inkra-alert-dialog-content-in var(--inkra-motion-normal) var(--inkra-ease);
   inset-block-start: 50%;
-  inset-inline-start: 50%;
+  left: 50%;
   max-height: min(80vh, calc(100dvh - var(--inkra-space-8)));
   outline: 0;
   position: fixed;
@@ -7643,11 +9246,23 @@ svg.leaflet-image-layer.leaflet-interactive path {
 
 .inkra-alert-dialog__content[data-state="closed"] {
   animation: inkra-alert-dialog-content-out var(--inkra-motion-normal) var(--inkra-ease);
+  pointer-events: none;
 }
 
-.inkra-alert-dialog__content:focus-visible {
-  outline: var(--inkra-focus-width) solid var(--inkra-focus);
-  outline-offset: var(--inkra-focus-offset);
+.inkra-alert-dialog__backdrop[data-state],
+.inkra-alert-dialog__content[data-state] { animation-fill-mode: both; }
+
+.inkra-alert-dialog__focus-ring {
+  --inkra-accent-strong: var(--inkra-focus);
+  inset: var(--inkra-focus-width);
+  opacity: 0;
+  pointer-events: none;
+  position: absolute !important;
+  z-index: 2;
+}
+
+.inkra-alert-dialog__content:focus > .inkra-alert-dialog__focus-ring {
+  opacity: 1;
 }
 
 .inkra-alert-dialog__surface,
@@ -7659,8 +9274,9 @@ svg.leaflet-image-layer.leaflet-interactive path {
   width: 100%;
 }
 
-.inkra-alert-dialog__surface { color: var(--inkra-ink); }
-.inkra-alert-dialog__layout { overflow: hidden; }
+.inkra-alert-dialog__surface { color: var(--inkra-ink); overflow: hidden; }
+.inkra-alert-dialog__layout { overflow: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
+.inkra-alert-dialog__layout:has(> .inkra-alert-dialog__body) { overflow: hidden; }
 
 .inkra-alert-dialog__header,
 .inkra-alert-dialog__body,
@@ -7714,7 +9330,6 @@ svg.leaflet-image-layer.leaflet-interactive path {
 
 @media (max-width: 30rem) {
   .inkra-alert-dialog__content {
-    max-height: calc(100dvh - var(--inkra-space-4));
     width: calc(100vw - var(--inkra-space-4));
   }
   .inkra-alert-dialog__header,
@@ -7722,14 +9337,25 @@ svg.leaflet-image-layer.leaflet-interactive path {
   .inkra-alert-dialog__footer { padding: var(--inkra-space-4); }
 }
 
+@media (max-height: 30rem) {
+  .inkra-alert-dialog__content { max-height: calc(100dvh - var(--inkra-space-4)); }
+}
+
 @media (prefers-reduced-motion: reduce) {
   .inkra-alert-dialog__backdrop,
-  .inkra-alert-dialog__content { animation: none; }
+  .inkra-alert-dialog__content { animation: none !important; }
+}
+
+@media print {
+  .inkra-alert-dialog__backdrop,
+  .inkra-alert-dialog__content { animation: none !important; }
 }
 
 @media (forced-colors: active) {
   .inkra-alert-dialog__backdrop { background: CanvasText; opacity: .25; }
   .inkra-alert-dialog__surface { background: Canvas; border: 1px solid CanvasText; }
+  .inkra-pencil-surface.inkra-alert-dialog__focus-ring { display: none !important; }
+  .inkra-alert-dialog__content:focus { outline: var(--inkra-focus-width) solid Highlight; outline-offset: calc(-1 * var(--inkra-focus-width)); }
   .inkra-alert-dialog__header[data-divided] { border-bottom: 1px solid CanvasText; }
   .inkra-alert-dialog__footer[data-divided] { border-top: 1px solid CanvasText; }
 }
@@ -7745,13 +9371,26 @@ svg.leaflet-image-layer.leaflet-interactive path {
 
 .inkra-drawer__content {
   box-sizing: border-box;
+  container-name: inkra-drawer;
+  container-type: inline-size;
   max-height: 100dvh;
   max-width: 100vw;
   outline: 0;
   position: fixed;
   z-index: calc(var(--inkra-z-modal, 30) + var(--inkra-floating-layer-offset, 0) + 1);
 }
-.inkra-drawer__content:focus-visible { outline: var(--inkra-focus-width) solid var(--inkra-focus); outline-offset: calc(-1 * var(--inkra-focus-width)); }
+.inkra-drawer__content:focus-visible { outline: 0; }
+.inkra-drawer__focus-ring {
+  --inkra-accent-strong: var(--inkra-focus);
+
+  display: block !important;
+  inset: var(--inkra-focus-width);
+  opacity: 0;
+  pointer-events: none;
+  position: absolute !important;
+  z-index: 3;
+}
+.inkra-drawer__content:focus-visible > .inkra-drawer__focus-ring { opacity: 1; }
 .inkra-drawer__content[data-direction="left"],
 .inkra-drawer__content[data-direction="right"] { block-size: 100dvh; inset-block: 0; inline-size: min(var(--inkra-drawer-size), 100vw); }
 .inkra-drawer__content[data-direction="left"] { animation: inkra-drawer-left-in var(--inkra-motion-slow) var(--inkra-ease); left: 0; }
@@ -7765,6 +9404,10 @@ svg.leaflet-image-layer.leaflet-interactive path {
 .inkra-drawer__content[data-state="closed"][data-direction="top"] { animation: inkra-drawer-top-out var(--inkra-motion-slow) var(--inkra-ease); }
 .inkra-drawer__content[data-state="closed"][data-direction="bottom"] { animation: inkra-drawer-bottom-out var(--inkra-motion-slow) var(--inkra-ease); }
 
+.inkra-drawer__backdrop[data-state],
+.inkra-drawer__content[data-state][data-direction] { animation-fill-mode: both; }
+.inkra-drawer__content[data-state="closed"] { pointer-events: none; }
+
 .inkra-drawer__surface,
 .inkra-drawer__layout { block-size: 100%; display: flex; flex-direction: column; min-height: 0; inline-size: 100%; }
 .inkra-drawer__surface { color: var(--inkra-ink); position: relative; }
@@ -7776,13 +9419,23 @@ svg.leaflet-image-layer.leaflet-interactive path {
 .inkra-drawer__content[data-direction="bottom"] .inkra-drawer__edge { block-size: 8px; inline-size: 100%; inset-block-start: -4px; inset-inline: 0; }
 
 .inkra-drawer__header,
-.inkra-drawer__footer { display: flex; flex: none; gap: var(--inkra-space-3); min-width: 0; padding: var(--inkra-space-5); position: relative; }
-.inkra-drawer__header { align-items: center; }
-.inkra-drawer__heading { display: grid; flex: 1; gap: var(--inkra-space-2); min-width: 0; overflow-wrap: anywhere; }
-.inkra-drawer__header-actions { align-items: center; display: flex; flex: none; gap: var(--inkra-space-2); }
+.inkra-drawer__body,
+.inkra-drawer__footer { box-sizing: border-box; gap: var(--inkra-space-3); min-width: 0; padding: var(--inkra-space-5); position: relative; }
+.inkra-drawer__header,
+.inkra-drawer__footer { flex: 0 1 auto; min-height: 0; }
+.inkra-drawer__header {
+  align-items: center;
+  display: flex;
+  max-block-size: 50%;
+  overflow: auto;
+  overscroll-behavior: contain;
+  scrollbar-gutter: stable;
+}
+.inkra-drawer__heading { display: grid; flex: 1 1 auto; gap: var(--inkra-space-2); min-width: 0; overflow-wrap: anywhere; }
+.inkra-drawer__header-actions { align-items: center; display: flex; flex: none; flex-wrap: wrap; gap: var(--inkra-space-2); justify-content: flex-end; max-inline-size: 100%; min-width: 0; overflow: auto; overscroll-behavior: contain; }
 .inkra-drawer__close-button { flex: none; }
-.inkra-drawer__body { flex: 1 1 auto; min-height: 0; min-width: 0; overflow: auto; overscroll-behavior: contain; padding: var(--inkra-space-5); scrollbar-gutter: stable; }
-.inkra-drawer__footer { align-items: center; flex-wrap: wrap; justify-content: flex-end; }
+.inkra-drawer__body { flex: 1 1 0; min-height: 0; min-width: 0; overflow: auto; overscroll-behavior: contain; padding: var(--inkra-space-5); scrollbar-gutter: stable; }
+.inkra-drawer__footer { align-items: center; display: flex; flex-wrap: wrap; justify-content: flex-end; max-block-size: 40%; overflow: auto; overscroll-behavior: contain; scrollbar-gutter: auto; }
 .inkra-drawer__footer[data-align="start"] { justify-content: flex-start; }
 .inkra-drawer__footer[data-align="center"] { justify-content: center; }
 .inkra-drawer__footer > .inkra-button { max-width: 100%; }
@@ -7793,6 +9446,11 @@ svg.leaflet-image-layer.leaflet-interactive path {
 .inkra-drawer__header > .inkra-drawer__divider { bottom: -4px; }
 .inkra-drawer__footer > .inkra-drawer__divider { top: -4px; }
 
+@container inkra-drawer (max-width: 24rem) {
+  .inkra-drawer__header[data-custom-action] { align-items: stretch; flex-direction: column; }
+  .inkra-drawer__header[data-custom-action] .inkra-drawer__header-actions { align-self: stretch; order: -1; }
+}
+
 @keyframes inkra-drawer-backdrop-in { from { opacity: 0; } to { opacity: 1; } }
 @keyframes inkra-drawer-backdrop-out { from { opacity: 1; } to { opacity: 0; } }
 @keyframes inkra-drawer-left-in { from { transform: translateX(-100%); } to { transform: translateX(0); } }
@@ -7814,7 +9472,12 @@ svg.leaflet-image-layer.leaflet-interactive path {
 
 @media (prefers-reduced-motion: reduce) {
   .inkra-drawer__backdrop,
-  .inkra-drawer__content { animation: none; }
+  .inkra-drawer__content { animation: none !important; }
+}
+
+@media print {
+  .inkra-drawer__backdrop,
+  .inkra-drawer__content { animation: none !important; }
 }
 
 @media (forced-colors: active) {
@@ -7826,26 +9489,51 @@ svg.leaflet-image-layer.leaflet-interactive path {
   .inkra-drawer__content[data-direction="bottom"] { border-top: 1px solid CanvasText; }
   .inkra-drawer__header[data-divided] { border-bottom: 1px solid CanvasText; }
   .inkra-drawer__footer[data-divided] { border-top: 1px solid CanvasText; }
-  .inkra-drawer__edge { display: none; }
+  .inkra-drawer__edge,
+  .inkra-drawer__focus-ring { display: none !important; }
+  .inkra-drawer__content:focus-visible { outline: var(--inkra-focus-width) solid Highlight; outline-offset: calc(-1 * var(--inkra-focus-width)); }
 }
 
 .inkra-date-picker {
+  --inkra-date-picker-control-height: var(--inkra-control-md);
+
   align-items: center;
   display: inline-flex;
-  gap: var(--inkra-space-1);
   max-width: 100%;
+  min-height: var(--inkra-touch-target);
   min-width: 0;
 }
 
+.inkra-date-picker[data-size="sm"] {
+  --inkra-date-picker-control-height: var(--inkra-control-sm);
+}
+
+.inkra-date-picker[data-size="lg"] {
+  --inkra-date-picker-control-height: var(--inkra-control-lg);
+}
+
 .inkra-date-picker[data-full-width] {
   display: flex;
   width: 100%;
 }
 
-.inkra-date-picker__trigger {
+.inkra-button-group.inkra-date-picker__control {
+  align-items: center;
+  block-size: var(--inkra-date-picker-control-height);
+  flex: 1 1 auto;
+  min-width: 0;
+  overflow: visible;
+}
+
+.inkra-date-picker__control > .inkra-date-picker__trigger {
+  flex: 1 1 auto;
   min-width: 0;
 }
 
+.inkra-date-picker__control > .inkra-date-picker__clear {
+  flex: 0 0 auto;
+}
+
 .inkra-date-picker__trigger .inkra-button__content {
   justify-content: flex-start;
   min-width: 0;
@@ -7868,6 +9556,12 @@ svg.leaflet-image-layer.leaflet-interactive path {
   visibility: hidden;
 }
 
+.inkra-date-picker__control .inkra-button-group__divider[data-orientation="vertical"] {
+  block-size: var(--inkra-date-picker-control-height);
+  inset-block-start: 50%;
+  transform: translateY(-50%);
+}
+
 .inkra-date-picker__form-field,
 .inkra-date-picker__accessible-value {
   block-size: 1px;
@@ -7909,18 +9603,35 @@ svg.leaflet-image-layer.leaflet-interactive path {
 }
 
 .inkra-time-picker {
+  --inkra-time-picker-control-height: var(--inkra-control-md);
+
   display: flex;
   align-items: center;
   gap: var(--inkra-space-2);
   position: relative;
+  min-height: var(--inkra-touch-target);
   min-width: 0;
   width: fit-content;
   max-width: 100%;
 }
+.inkra-time-picker[data-size="sm"] { --inkra-time-picker-control-height: var(--inkra-control-sm); }
+.inkra-time-picker[data-size="lg"] { --inkra-time-picker-control-height: var(--inkra-control-lg); }
 .inkra-time-picker[data-full-width="true"] { width: 100%; }
-.inkra-time-picker__trigger { flex: 1; min-width: 0; }
-.inkra-time-picker__clear { flex: none; }
+.inkra-button-group.inkra-time-picker__control {
+  align-items: center;
+  block-size: var(--inkra-time-picker-control-height);
+  flex: 1 1 auto;
+  min-width: 0;
+  overflow: visible;
+}
+.inkra-time-picker__control > .inkra-time-picker__trigger { flex: 1 1 auto; min-width: 0; }
+.inkra-time-picker__control > .inkra-time-picker__clear { flex: 0 0 auto; }
 .inkra-time-picker__clear[aria-hidden="true"] { visibility: hidden; }
+.inkra-time-picker__control .inkra-button-group__divider[data-orientation="vertical"] {
+  block-size: var(--inkra-time-picker-control-height);
+  inset-block-start: 50%;
+  transform: translateY(-50%);
+}
 .inkra-time-picker[data-invalid="true"] { color: var(--inkra-danger); }
 .inkra-time-picker__native,
 .inkra-time-picker__accessible-value {
@@ -7961,11 +9672,14 @@ svg.leaflet-image-layer.leaflet-interactive path {
 .inkra-pagination { min-inline-size: 0; max-inline-size: 100%; color: var(--inkra-ink); }
 .inkra-pagination__list { box-sizing: border-box; display: flex; flex-wrap: nowrap; align-items: center; gap: var(--inkra-space-1); max-inline-size: 100%; overflow-x: auto; overscroll-behavior-inline: contain; scroll-padding-inline: 8px; list-style: none; padding: 8px; margin: 0; }
 .inkra-pagination__list > li { display: flex; flex: 0 0 auto; }
-.inkra-pagination__page.inkra-button { min-inline-size: var(--inkra-touch-target); }
-.inkra-pagination__page .inkra-button__surface { padding-inline: var(--inkra-space-2); }
+.inkra-pagination__summary { align-items: center; box-sizing: border-box; font-variant-numeric: tabular-nums; justify-content: center; max-inline-size: 100%; min-block-size: var(--inkra-touch-target); min-inline-size: 0; overflow-wrap: anywhere; padding-inline: var(--inkra-space-2); text-align: center; white-space: normal; }
+.inkra-pagination__page-item { max-inline-size: max(var(--inkra-touch-target), 50%); }
+.inkra-pagination__page.inkra-button { max-inline-size: 100%; min-inline-size: var(--inkra-touch-target); scroll-margin-inline: 8px; }
+.inkra-pagination__page .inkra-button__surface { height: auto; min-height: var(--inkra-button-visual-height); padding-block: var(--inkra-space-1); padding-inline: var(--inkra-space-2); }
 .inkra-pagination__page .inkra-button__surface { isolation: isolate; }
+.inkra-pagination__page > .inkra-button__focus-ring { height: auto; inset-block: 0; top: 0; transform: none; }
 .inkra-pagination__page .inkra-button__content,
-.inkra-pagination__page .inkra-button__label { position: static; }
+.inkra-pagination__page .inkra-button__label { max-inline-size: 100%; min-inline-size: 0; overflow-wrap: anywhere; position: static; white-space: normal; }
 .inkra-pagination__selection { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
 .inkra-pagination__page[aria-current="page"] { color: var(--inkra-selection-foreground); }
 .inkra-pagination__ellipsis { min-inline-size: 24px; min-block-size: var(--inkra-touch-target); align-items: center; justify-content: center; }
@@ -7973,71 +9687,102 @@ svg.leaflet-image-layer.leaflet-interactive path {
 .inkra-pagination__sr-only { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
 @media (forced-colors: active) {
   .inkra-pagination__page[aria-current="page"] { color: HighlightText; background: Highlight; outline: 1px solid Highlight; }
-  .inkra-pagination__selection { display: none; }
+  .inkra-pencil-surface.inkra-pagination__selection { display: none !important; }
 }
 @media (prefers-reduced-motion: reduce) { .inkra-pagination * { transition: none !important; animation: none !important; } }
 
 .inkra-command { inline-size: 100%; min-inline-size: 0; color: var(--inkra-ink); font-family: var(--inkra-font-body); font-size: var(--inkra-text-md); line-height: var(--inkra-line-ui); }
 .inkra-command__paper { min-inline-size: 0; }
 .inkra-command__input-wrap { position: relative; padding: var(--inkra-space-2) var(--inkra-space-3); }
-.inkra-command__input { display: block; box-sizing: border-box; inline-size: 100%; min-inline-size: 0; min-block-size: var(--inkra-touch-target); border: 0; border-radius: 0; background: transparent; color: inherit; font: inherit; padding: var(--inkra-space-2); }
+.inkra-command__input-frame { align-items: center; box-sizing: border-box; display: flex; flex: 1 1 auto; inline-size: 100%; min-block-size: var(--inkra-touch-target); min-inline-size: 0; padding-inline: var(--inkra-space-3); position: relative; }
+.inkra-command__input-icon { align-items: center; color: var(--inkra-ink-muted); display: inline-flex; flex: 0 0 22px; block-size: 22px; inline-size: 22px; }
+.inkra-command__input { --inkra-editable-placeholder-color: var(--inkra-ink-subtle); --inkra-editable-text-color: var(--inkra-ink); display: block; box-sizing: border-box; flex: 1 1 auto; inline-size: 0; min-inline-size: 0; min-block-size: var(--inkra-touch-target); border: 0; border-radius: 0; background: transparent; caret-color: var(--inkra-ink); color: inherit; font: inherit; padding: 0 var(--inkra-space-2); outline: 0; position: relative; z-index: 2; }
 .inkra-command__input::placeholder { color: var(--inkra-ink-subtle); opacity: 1; }
-.inkra-command__input:focus-visible { outline: var(--inkra-focus-width) solid var(--inkra-focus); outline-offset: 0; border-radius: var(--inkra-radius-md); }
+.inkra-command__input-frame > .inkra-editable-text { display: none; opacity: 0; pointer-events: none; position: absolute; z-index: 3; }
+.inkra-command__input-wrap[data-pencil-editable-ready="true"] .inkra-editable-text { display: block; opacity: 1; }
+.inkra-command__input-wrap[data-pencil-editable-ready="true"] .inkra-command__input { color: transparent !important; }
+.inkra-command__input-wrap[data-pencil-editable-ready="true"] .inkra-command__input::placeholder { color: transparent !important; }
+.inkra-command__input-wrap[data-pencil-editable-ready="true"] .inkra-command__input::selection { background: var(--inkra-selection); color: transparent; }
 .inkra-command__input-line { position: absolute; inset-inline: 12px; inset-block-end: 0; }
-.inkra-command__list { box-sizing: border-box; max-block-size: min(360px, 50vh); overflow: auto; overscroll-behavior: contain; padding: var(--inkra-space-2); scroll-padding-block: var(--inkra-space-2); }
+.inkra-command__input-focus-line { color: var(--inkra-focus); opacity: 0; pointer-events: none; position: absolute; inset-inline: 12px; inset-block-end: 0; z-index: 4; }
+.inkra-command__input-wrap > .inkra-pencil-line[data-orientation="horizontal"] { width: calc(100% - 24px); }
+.inkra-command__input-wrap:focus-within .inkra-command__input-focus-line { opacity: 1; }
+.inkra-command__list { box-sizing: border-box; max-block-size: min(360px, 50dvh); overflow: auto; overscroll-behavior: contain; padding: var(--inkra-space-2); scroll-padding-block: var(--inkra-space-2); }
 .inkra-command__group[hidden] { display: none; }
 .inkra-command__group [cmdk-group-heading] { padding: var(--inkra-space-2) var(--inkra-space-3); color: var(--inkra-ink-muted); font-size: var(--inkra-text-sm); overflow-wrap: anywhere; }
-.inkra-command__item { position: relative; isolation: isolate; box-sizing: border-box; display: flex; align-items: center; gap: var(--inkra-space-2); min-block-size: var(--inkra-touch-target); padding: var(--inkra-space-2) var(--inkra-space-3); cursor: pointer; border-radius: var(--inkra-radius-md); overflow-wrap: anywhere; }
+.inkra-command__item { position: relative; isolation: isolate; box-sizing: border-box; display: flex; align-items: center; gap: var(--inkra-space-2); min-block-size: var(--inkra-touch-target); min-inline-size: 0; padding: var(--inkra-space-2) var(--inkra-space-3); cursor: pointer; border-radius: var(--inkra-radius-md); overflow-wrap: anywhere; }
 .inkra-command__highlight { position: absolute; inset: 0; z-index: -1; opacity: 0; pointer-events: none; }
+.inkra-command__item-focus { --inkra-accent-strong: var(--inkra-focus); inset: var(--inkra-focus-width); opacity: 0; pointer-events: none; position: absolute !important; z-index: 2; }
 .inkra-command__item[data-selected="true"] { color: var(--inkra-selection-foreground); }
 .inkra-command__item[data-selected="true"] > .inkra-command__highlight { opacity: 1; }
 .inkra-command__item[data-disabled="true"] { color: var(--inkra-ink-subtle); cursor: not-allowed; }
-.inkra-command__item:focus-visible { outline: var(--inkra-focus-width) solid var(--inkra-focus); outline-offset: -2px; }
+.inkra-command__item:focus-visible { outline: 0; }
+.inkra-command__item:focus-visible > .inkra-command__item-focus { opacity: 1; }
 .inkra-command__icon { flex: 0 0 24px; inline-size: 24px; display: inline-flex; align-items: center; justify-content: center; }
-.inkra-command__label { min-inline-size: 0; flex: 1; }
-.inkra-command__shortcut { flex: 0 1 auto; margin-inline-start: auto; font: inherit; font-size: var(--inkra-text-sm); color: inherit; text-align: end; overflow-wrap: anywhere; }
+.inkra-command__label { flex: 1 1 auto; min-inline-size: 0; overflow-wrap: anywhere; }
+.inkra-command__shortcut { flex: 0 1 12rem; min-inline-size: 0; max-inline-size: 45%; margin-inline-start: auto; font: inherit; font-size: var(--inkra-text-sm); color: inherit; text-align: end; overflow-wrap: anywhere; }
 .inkra-command__empty { padding: var(--inkra-space-6) var(--inkra-space-3); text-align: center; color: var(--inkra-ink-muted); overflow-wrap: anywhere; }
 .inkra-command__separator { padding-block: var(--inkra-space-1); }
 @media (forced-colors: active) {
   .inkra-command__paper { border: 1px solid CanvasText; }
-  .inkra-command__input { border-block-end: 1px solid CanvasText; }
-  .inkra-command__item[data-selected="true"] { background: Highlight; color: HighlightText; outline: 1px solid Highlight; }
+  .inkra-command__input-focus-line, .inkra-command__item-focus { display: none !important; }
+  .inkra-command__input-frame > .inkra-editable-text { display: none !important; }
+  .inkra-command__input-wrap[data-pencil-editable-ready="true"] .inkra-command__input { color: FieldText !important; caret-color: FieldText; }
+  .inkra-command__input-wrap[data-pencil-editable-ready="true"] .inkra-command__input::placeholder { color: GrayText !important; opacity: 1; }
+  .inkra-command__input-wrap[data-pencil-editable-ready="true"] .inkra-command__input::selection { background: Highlight; color: HighlightText; }
+  .inkra-command__input:focus-visible { outline: var(--inkra-focus-width) solid Highlight; outline-offset: calc(-1 * var(--inkra-focus-width)); }
+  .inkra-command__item[data-selected="true"] { background: Highlight; color: HighlightText; outline: 1px solid Highlight; forced-color-adjust: none; }
+  .inkra-command__item:focus-visible { outline: var(--inkra-focus-width) solid Highlight; outline-offset: calc(-1 * var(--inkra-focus-width)); }
   .inkra-command__item[data-disabled="true"] { color: GrayText; }
   .inkra-command__highlight { display: none; }
   .inkra-command__separator { border-block-end: 1px solid CanvasText; }
 }
 @media (prefers-reduced-motion: reduce) { .inkra-command * { animation: none !important; transition: none !important; } }
+@media print {
+  .inkra-command__input-frame > .inkra-editable-text { display: none !important; }
+  .inkra-command__input-wrap[data-pencil-editable-ready="true"] .inkra-command__input { color: var(--inkra-ink) !important; }
+  .inkra-command__input-wrap[data-pencil-editable-ready="true"] .inkra-command__input::placeholder { color: var(--inkra-ink-subtle) !important; opacity: 1; }
+}
 
-.inkra-data-table { display: grid; gap: var(--inkra-space-3); min-width: 0; width: 100%; color: var(--inkra-ink); }
+.inkra-data-table { container-type: inline-size; display: grid; gap: var(--inkra-space-3); min-width: 0; width: 100%; color: var(--inkra-ink); }
 .inkra-data-table__toolbar { display: flex; flex-wrap: wrap; align-items: end; gap: var(--inkra-space-3); }
 .inkra-data-table__filter { display: grid; gap: var(--inkra-space-1); width: min(100%, 320px); font-size: var(--inkra-text-sm); color: var(--inkra-ink-muted); }
 .inkra-data-table__container { width: 100%; }
-.inkra-data-table__sort { appearance: none; border: 0; background: transparent; color: inherit; font: inherit; display: inline-flex; align-items: center; gap: var(--inkra-space-2); min-height: var(--inkra-touch-target); max-width: 100%; padding: 0; text-align: start; cursor: pointer; }
-.inkra-data-table__sort > span:first-child { min-width: 0; overflow-wrap: anywhere; }
-.inkra-data-table__sort canvas { flex: none; opacity: .55; }
-.inkra-data-table__sort[data-sorted] canvas { opacity: 1; color: var(--inkra-accent-strong); }
-.inkra-data-table__sort:focus-visible { outline: 2px solid var(--inkra-focus); outline-offset: 2px; }
+.inkra-data-table__sort { appearance: none; border: 0; background: transparent; color: inherit; font: inherit; display: inline-flex; align-items: center; gap: var(--inkra-space-2); min-height: var(--inkra-touch-target); min-width: 0; max-width: 100%; padding: 0 var(--inkra-space-1); position: relative; text-align: start; cursor: pointer; }
+.inkra-data-table__sort-label { min-width: 0; overflow-wrap: anywhere; position: relative; z-index: 1; }
+.inkra-data-table__sort-icon { flex: none; opacity: .55; position: relative; z-index: 1; }
+.inkra-data-table__sort[data-sorted] .inkra-data-table__sort-icon { opacity: 1; color: var(--inkra-accent-strong); }
+.inkra-data-table__sort:focus-visible { outline: 0; }
+.inkra-data-table__sort-focus { --inkra-accent-strong: var(--inkra-focus); display: block !important; inset: 1px; opacity: 0; pointer-events: none; position: absolute !important; z-index: 2; }
+.inkra-data-table__sort:focus-visible > .inkra-data-table__sort-focus { opacity: 1; }
 .inkra-data-table__select-cell { width: 52px; padding-inline: var(--inkra-space-2) !important; text-align: center !important; }
 .inkra-data-table__selection.inkra-selection-control { display: inline-grid; grid-template-columns: var(--inkra-touch-target); gap: 0; width: var(--inkra-touch-target); min-height: var(--inkra-touch-target); vertical-align: middle; }
 .inkra-data-table__selection .inkra-selection-control__copy { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }
 .inkra-data-table__state { min-height: 72px; display: grid; place-items: center; color: var(--inkra-ink-muted); text-align: center; }
-.inkra-data-table__pagination { display: flex; align-items: center; justify-content: flex-end; gap: var(--inkra-space-2); min-width: 0; }
-.inkra-data-table__pagination > span { min-width: 8rem; text-align: center; color: var(--inkra-ink-muted); }
+.inkra-data-table__pagination { display: flex; align-items: center; justify-content: flex-end; gap: var(--inkra-space-2); min-width: 0; width: 100%; }
+.inkra-data-table__pagination > .inkra-button { flex: none; }
+.inkra-data-table__pagination > span { min-width: 8rem; max-width: 100%; text-align: center; color: var(--inkra-ink-muted); overflow-wrap: anywhere; }
+.inkra-data-table__page-arrow:dir(rtl) { transform: scaleX(-1); }
 .inkra-visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
-@media (max-width: 30rem) {
-  .inkra-data-table__pagination { justify-content: space-between; }
+@container (max-width: 30rem) {
+  .inkra-data-table__pagination { display: grid; grid-template-columns: var(--inkra-touch-target) minmax(0, 1fr) var(--inkra-touch-target); justify-content: stretch; }
   .inkra-data-table__pagination > span { min-width: 0; }
 }
 @media (forced-colors: active) {
-  .inkra-data-table__sort:focus-visible { outline: 2px solid Highlight; }
+  .inkra-data-table__sort-focus { display: none !important; }
+  .inkra-data-table__sort:focus-visible { outline: var(--inkra-focus-width) solid Highlight; outline-offset: calc(-1 * var(--inkra-focus-width)); }
+  .inkra-data-table__sort[data-sorted] .inkra-data-table__sort-icon { color: Highlight; }
 }
+@media (prefers-reduced-motion: reduce) { .inkra-data-table * { animation: none !important; transition: none !important; } }
+@media print { .inkra-data-table__sort-focus { display: none !important; } }
 
 .inkra-tree { display: grid; gap: 2px; min-width: 0; color: var(--inkra-ink); outline: none; }
 .inkra-tree__item { position: relative; min-width: 0; outline: none; }
-.inkra-tree__item-content { position: relative; isolation: isolate; display: grid; grid-template-columns: var(--inkra-touch-target) minmax(0, auto) minmax(0, 1fr); align-items: center; min-height: var(--inkra-touch-target); padding-inline-start: calc((var(--inkra-tree-level, 1) - 1) * 24px); padding-inline-end: var(--inkra-space-2); border-radius: var(--inkra-radius-md); overflow: visible; }
+.inkra-tree__item-content { --inkra-tree-reserved-inline: calc(var(--inkra-touch-target) + var(--inkra-space-2) + 5rem); position: relative; isolation: isolate; display: grid; grid-template-columns: var(--inkra-touch-target) minmax(0, auto) minmax(0, 1fr); align-items: start; box-sizing: border-box; inline-size: 100%; min-height: var(--inkra-touch-target); padding-inline-start: min(calc((var(--inkra-tree-level, 1) - 1) * var(--inkra-tree-indent, 24px)), max(0px, calc(100% - var(--inkra-tree-reserved-inline)))); padding-inline-end: var(--inkra-space-2); border-radius: var(--inkra-radius-md); overflow: visible; }
+.inkra-tree__item-content[data-has-icon] { --inkra-tree-reserved-inline: calc(var(--inkra-touch-target) + 28px + var(--inkra-space-2) + 5rem); }
 .inkra-tree__item-content:not([data-has-icon]) { grid-template-columns: var(--inkra-touch-target) minmax(0, 1fr); }
 .inkra-tree__selection, .inkra-tree__focus { position: absolute; inset: 2px; z-index: -1; pointer-events: none; }
-.inkra-tree__focus { inset: -1px; z-index: 2; }
+.inkra-tree__focus { inset: 1px; z-index: 2; }
 .inkra-tree__disclosure, .inkra-tree__disclosure-spacer { width: var(--inkra-touch-target); height: var(--inkra-touch-target); }
 .inkra-tree__disclosure { position: relative; appearance: none; display: inline-grid; place-items: center; border: 0; padding: 0; background: transparent; color: var(--inkra-ink); cursor: pointer; }
 .inkra-tree__disclosure:focus { outline: none; }
@@ -8048,42 +9793,83 @@ svg.leaflet-image-layer.leaflet-interactive path {
 .inkra-tree__item-content[data-expanded] .inkra-tree__chevron { transform: rotate(0deg); }
 .inkra-tree:dir(rtl) .inkra-tree__chevron { transform: rotate(90deg); }
 .inkra-tree:dir(rtl) .inkra-tree__item-content[data-expanded] .inkra-tree__chevron { transform: rotate(0deg); }
-.inkra-tree__icon { display: inline-grid; place-items: center; width: 28px; height: 28px; color: var(--inkra-accent-strong); }
+.inkra-tree__icon { display: inline-grid; place-items: center; width: 28px; height: 28px; margin-block-start: var(--inkra-space-1); color: var(--inkra-accent-strong); }
 .inkra-tree__icon > * { max-width: 100%; max-height: 100%; }
 .inkra-tree__copy { display: grid; gap: 2px; min-width: 0; padding-block: var(--inkra-space-2); overflow-wrap: anywhere; }
+.inkra-tree[data-size="sm"] .inkra-tree__copy { padding-block: var(--inkra-space-1); }
+.inkra-tree[data-size="lg"] .inkra-tree__copy { padding-block: var(--inkra-space-3); }
+.inkra-tree[data-size="lg"] .inkra-tree__item-content { min-height: 52px; }
 .inkra-tree__title { min-width: 0; font-size: var(--inkra-text-md); line-height: var(--inkra-line-ui); }
 .inkra-tree__description { min-width: 0; color: var(--inkra-ink-muted); font-size: var(--inkra-text-sm); line-height: var(--inkra-line-body); }
 .inkra-tree__item[data-disabled] .inkra-tree__item-content { opacity: .55; }
 .inkra-tree__empty { min-height: 72px; display: grid; place-items: center; padding: var(--inkra-space-4); color: var(--inkra-ink-muted); text-align: center; }
+
+.inkra-tree__item-content { animation: inkra-tree-row-in var(--inkra-motion-normal) var(--inkra-ease); }
+.inkra-tree__selection { animation: inkra-tree-selection-in var(--inkra-motion-fast) var(--inkra-ease); }
+
+@keyframes inkra-tree-row-in {
+  from { opacity: 0; transform: translateY(calc(-1 * var(--inkra-space-1))); }
+  to { opacity: 1; transform: translateY(0); }
+}
+
+@keyframes inkra-tree-selection-in {
+  from { opacity: 0; }
+  to { opacity: 1; }
+}
+
 @media (prefers-reduced-motion: reduce) {
   .inkra-tree__chevron { transition: none; }
+  .inkra-tree__item-content,
+  .inkra-tree__selection { animation: none !important; }
+}
+
+@media print {
+  .inkra-tree__item-content,
+  .inkra-tree__selection { animation: none !important; }
 }
 @media (forced-colors: active) {
+  .inkra-pencil-surface.inkra-tree__selection,
+  .inkra-pencil-surface.inkra-tree__focus,
+  .inkra-pencil-surface.inkra-tree__disclosure-focus { display: none !important; }
   .inkra-tree__item[data-selected] .inkra-tree__item-content { outline: 1px solid Highlight; color: HighlightText; background: Highlight; forced-color-adjust: none; }
   .inkra-tree__item[data-focus-visible] .inkra-tree__item-content { outline: 2px solid Highlight; outline-offset: -2px; }
   .inkra-tree__disclosure[data-focus-visible] { outline: 2px solid Highlight; outline-offset: -2px; }
 }
 
-.inkra-upload { display: grid; gap: var(--inkra-space-4); min-width: 0; color: var(--inkra-ink); }
+.inkra-upload { container-type: inline-size; display: grid; gap: var(--inkra-space-4); min-width: 0; color: var(--inkra-ink); }
 .inkra-upload__dropzone {
-  min-height: 148px; padding: var(--inkra-space-6); display: grid; place-items: center; align-content: center;
+  position: relative; min-height: 148px; padding: var(--inkra-space-6); display: grid; place-items: center; align-content: center;
   gap: var(--inkra-space-2); text-align: center; cursor: pointer; border-radius: var(--inkra-radius-lg);
 }
-.inkra-upload__dropzone:focus-visible { outline: var(--inkra-focus-width) solid var(--inkra-focus); outline-offset: var(--inkra-focus-offset); }
+.inkra-upload__focus-ring {
+  --inkra-accent-strong: var(--inkra-focus);
+  position: absolute !important; inset: var(--inkra-focus-width); display: block !important;
+  opacity: 0; pointer-events: none; z-index: 3;
+}
+.inkra-upload__dropzone:focus-visible { outline: 0; }
+.inkra-upload__dropzone:focus-visible .inkra-upload__focus-ring { opacity: 1; }
 .inkra-upload__dropzone[data-drag-active] { color: var(--inkra-selection-foreground); }
 .inkra-upload[data-disabled] .inkra-upload__dropzone { cursor: not-allowed; opacity: 0.55; }
-.inkra-upload__input { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
+.inkra-upload__input { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; pointer-events: none; }
 .inkra-upload__icon { color: currentColor; }
 .inkra-upload__prompt { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--inkra-space-2); font-size: var(--inkra-text-md); }
 .inkra-upload__hint, .inkra-upload__meta { color: var(--inkra-ink-muted); font-size: var(--inkra-text-sm); }
 .inkra-upload__rejections { color: var(--inkra-danger-foreground); }
 .inkra-upload__rejections ul { margin: var(--inkra-space-2) 0 0; padding-inline-start: var(--inkra-space-6); }
 .inkra-upload__list { display: grid; gap: var(--inkra-space-3); margin: 0; padding: 0; list-style: none; }
-.inkra-upload__item-surface { display: flex; align-items: center; justify-content: space-between; gap: var(--inkra-space-4); padding: var(--inkra-space-4); }
+.inkra-upload__item-surface { display: flex; align-items: center; justify-content: space-between; gap: var(--inkra-space-4); min-width: 0; padding: var(--inkra-space-4); }
 .inkra-upload__file { display: grid; min-width: 0; flex: 1; gap: var(--inkra-space-1); }
-.inkra-upload__name { overflow-wrap: anywhere; }
+.inkra-upload__name { max-width: 100%; }
 .inkra-upload__error { color: var(--inkra-danger-foreground); font-size: var(--inkra-text-sm); }
-.inkra-upload__actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: var(--inkra-space-1); }
+.inkra-upload__actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: var(--inkra-space-1); max-width: 100%; min-width: 0; }
+.inkra-upload__actions > .inkra-button { max-width: 100%; }
+.inkra-upload__actions .inkra-button__surface,
+.inkra-upload__actions .inkra-button__content { max-width: 100%; min-width: 0; }
+.inkra-upload__actions .inkra-button__label { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
+.inkra-upload__actions .inkra-button__label > .inkra-pencil-text,
+.inkra-upload__actions .inkra-button__label > .inkra-pencil-text > .inkra-pencil-text__source {
+  display: block; max-width: 100%; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
+}
 .inkra-upload .inkra-progress { inline-size: min(280px, 100%); }
 .inkra-upload__item[data-status="success"] .inkra-upload__meta { color: var(--inkra-success-foreground); }
 .inkra-upload__item[data-status="error"] .inkra-upload__meta,
@@ -8091,10 +9877,22 @@ svg.leaflet-image-layer.leaflet-interactive path {
 @media (max-width: 36rem) {
   .inkra-upload__dropzone { padding: var(--inkra-space-4); }
   .inkra-upload__item-surface { align-items: stretch; flex-direction: column; }
-  .inkra-upload__actions { justify-content: flex-start; }
+  .inkra-upload__actions { inline-size: 100%; justify-content: flex-start; }
+}
+@container (max-width: 36rem) {
+  .inkra-upload__dropzone { padding: var(--inkra-space-4); }
+  .inkra-upload__item-surface { align-items: stretch; flex-direction: column; }
+  .inkra-upload__actions { inline-size: 100%; justify-content: flex-start; }
+}
+@container (max-width: 24rem) {
+  .inkra-upload__actions { display: grid; grid-template-columns: minmax(0, 1fr); }
+  .inkra-upload__actions > .inkra-button { inline-size: 100%; }
+  .inkra-upload__actions .inkra-button__surface { inline-size: 100%; }
 }
 @media (forced-colors: active) {
   .inkra-upload__dropzone { border: 1px solid CanvasText; }
+  .inkra-upload__dropzone:focus-visible { outline: 2px solid Highlight; outline-offset: var(--inkra-focus-offset); }
+  .inkra-upload__focus-ring { display: none !important; }
   .inkra-upload__dropzone[data-drag-active] { outline: 2px solid Highlight; }
   .inkra-upload__error, .inkra-upload__rejections { color: CanvasText; }
 }