@threadlabs/looma 0.13.2 → 0.13.3

package/vue/components.css

@@ -64,16 +64,22 @@
   display: none;
 }
 
-[data-component~="ui-affordance-scope"][data-v-0288ef7b] {
+[data-component~="ui-affordance-scope"][data-v-0ec8d3e6] {
   display: contents;
   --ui-affordance-scope-engaged: 0;
+  --ui-affordance-scope-guide: 1;
 }
-[data-component~="ui-affordance-scope"][data-ui-affordance-scope-state~="engaged"][data-v-0288ef7b] {
+[data-component~="ui-affordance-scope"][data-ui-affordance-scope-state~="engaged"][data-v-0ec8d3e6] {
   --ui-affordance-scope-engaged: 1;
 }
 
+/* Published to descendants: each guide multiplies its opacity by it, so none reaches them all. */
+[data-component~="ui-affordance-scope"][data-ui-affordance-scope-state~="guide=none"][data-v-0ec8d3e6] {
+  --ui-affordance-scope-guide: 0;
+}
+
 /* A component that sets its display still honours the hidden attribute on its root. */
-[data-component~="ui-affordance-scope"][hidden][data-v-0288ef7b] {
+[data-component~="ui-affordance-scope"][hidden][data-v-0ec8d3e6] {
   display: none;
 }
 
@@ -2654,39 +2660,39 @@ from {
   display: none;
 }
 
-[data-component~="ui-editor-table-overlay"][data-v-af4935bb] {
+[data-component~="ui-editor-table-overlay"][data-v-0de9cbcc] {
   display: block;
   width: 100%;
   height: 100%;
   overflow: visible;
   pointer-events: none;
 }
-[data-component~="ui-editor-table-overlay"][data-v-af4935bb] {
+[data-component~="ui-editor-table-overlay"][data-v-0de9cbcc] {
   position: relative;
   width: 100%;
   height: 100%;
   overflow: visible;
   pointer-events: none;
 }
-.rows[data-v-af4935bb],
-.cols[data-v-af4935bb] {
+.rows[data-v-0de9cbcc],
+.cols[data-v-0de9cbcc] {
   pointer-events: none;
   position: absolute;
 }
-.rows[data-v-af4935bb] {
+.rows[data-v-0de9cbcc] {
   inset: 0;
   width: 100%;
 }
-.cols[data-v-af4935bb] {
+.cols[data-v-0de9cbcc] {
   inset: 0;
   height: 100%;
 }
-.control[data-v-af4935bb] {
+.control[data-v-0de9cbcc] {
   position: absolute;
   z-index: 1;
   pointer-events: none;
 }
-.handle[data-v-af4935bb] {
+.handle[data-v-0de9cbcc] {
   position: absolute;
   display: inline-flex;
   align-items: center;
@@ -2713,86 +2719,86 @@ from {
   pointer-events: auto;
   cursor: pointer;
 }
-.handle[data-v-af4935bb] {
+.handle[data-v-0de9cbcc] {
   --_ui-default-icon-size: 14px;
   --_ui-default-icon-stroke-width: 2;
 }
-.handle[data-ui-proximity="near"][data-v-af4935bb],
-.control.active .handle[data-v-af4935bb],
-.handle[data-v-af4935bb]:focus-visible {
+.handle[data-ui-proximity="near"][data-v-0de9cbcc],
+.control.active .handle[data-v-0de9cbcc],
+.handle[data-v-0de9cbcc]:focus-visible {
   opacity: 1;
   scale: 1;
 }
-.control.active .handle[data-v-af4935bb],
-.handle[data-v-af4935bb]:focus-visible {
+.control.active .handle[data-v-0de9cbcc],
+.handle[data-v-0de9cbcc]:focus-visible {
   border-color: var(--ui-affordance-direct-color, var(--ui-accent-solid));
   background: var(--ui-affordance-direct-color, var(--ui-accent-solid));
   color: var(--ui-text-on-accent);
   box-shadow: var(--ui-shadow-sm, 0 1px 3px rgb(0 0 0 / 0.1));
 }
-.handle[data-v-af4935bb]:focus-visible,
-.selector[data-v-af4935bb]:focus-visible,
-.cell-menu[data-v-af4935bb]:focus-visible {
+.handle[data-v-0de9cbcc]:focus-visible,
+.selector[data-v-0de9cbcc]:focus-visible,
+.cell-menu[data-v-0de9cbcc]:focus-visible {
   outline: 2px solid var(--ui-focus-ring);
   outline-offset: 2px;
 }
-.control.row[data-v-af4935bb] {
+.control.row[data-v-0de9cbcc] {
   left: 0;
   width: 100%;
   height: 0;
 }
-.control.row .handle[data-v-af4935bb] {
+.control.row .handle[data-v-0de9cbcc] {
   top: -12px;
   left: -30px;
 }
-.control.col[data-v-af4935bb] {
+.control.col[data-v-0de9cbcc] {
   top: 0;
   width: 0;
   height: 100%;
 }
-.control.col .handle[data-v-af4935bb] {
+.control.col .handle[data-v-0de9cbcc] {
   top: -30px;
   left: -12px;
 }
-.line[data-v-af4935bb] {
+.line[data-v-0de9cbcc] {
   position: absolute;
   background: var(--ui-affordance-direct-color, var(--ui-accent-solid));
   opacity: 0;
   transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);
 }
-.control.row .line[data-v-af4935bb] {
+.control.row .line[data-v-0de9cbcc] {
   inset: -1px 0 auto;
   height: 2px;
 }
-.control.col .line[data-v-af4935bb] {
+.control.col .line[data-v-0de9cbcc] {
   inset: 0 auto 0 -1px;
   width: 2px;
 }
-.control.active .line[data-v-af4935bb] {
+.control.active .line[data-v-0de9cbcc] {
   opacity: 0.8;
 }
-.guide[data-v-af4935bb] {
+.guide[data-v-0de9cbcc] {
   position: absolute;
   width: var(--ui-affordance-guide-size);
   height: var(--ui-affordance-guide-size);
   border-radius: var(--ui-radius-round);
   background: var(--ui-affordance-guide-color, var(--ui-border-strong));
-  opacity: var(--ui-affordance-guide-opacity);
+  opacity: calc(var(--ui-affordance-guide-opacity) * var(--ui-affordance-scope-guide, 1));
   transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);
 }
-.control.row .guide[data-v-af4935bb] {
+.control.row .guide[data-v-0de9cbcc] {
   left: -10px;
   top: -2px;
 }
-.control.col .guide[data-v-af4935bb] {
+.control.col .guide[data-v-0de9cbcc] {
   left: -2px;
   top: -10px;
 }
-.control:has(.handle[data-ui-proximity="near"]) .guide[data-v-af4935bb],
-.control.active .guide[data-v-af4935bb] {
+.control:has(.handle[data-ui-proximity="near"]) .guide[data-v-0de9cbcc],
+.control.active .guide[data-v-0de9cbcc] {
   opacity: 0;
 }
-.tooltip[data-v-af4935bb] {
+.tooltip[data-v-0de9cbcc] {
   position: absolute;
   z-index: 2;
   top: calc(100% + 6px);
@@ -2811,18 +2817,18 @@ from {
   transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);
   pointer-events: none;
 }
-.control.row .tooltip[data-v-af4935bb] {
+.control.row .tooltip[data-v-0de9cbcc] {
   top: 50%;
   left: auto;
   right: calc(100% + 8px);
   transform: translateY(-50%);
 }
-.control.active .tooltip[data-v-af4935bb],
-.handle:focus-visible .tooltip[data-v-af4935bb] {
+.control.active .tooltip[data-v-0de9cbcc],
+.handle:focus-visible .tooltip[data-v-0de9cbcc] {
   opacity: 1;
 }
-.selector[data-v-af4935bb],
-.cell-menu[data-v-af4935bb] {
+.selector[data-v-0de9cbcc],
+.cell-menu[data-v-0de9cbcc] {
   position: absolute;
   z-index: 2;
   display: inline-flex;
@@ -2841,27 +2847,27 @@ from {
     border-color var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),
     box-shadow var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);
 }
-.selector[data-v-af4935bb]:hover,
-.cell-menu[data-v-af4935bb]:hover {
+.selector[data-v-0de9cbcc]:hover,
+.cell-menu[data-v-0de9cbcc]:hover {
   background: var(--ui-surface-muted);
   color: var(--ui-text-primary);
   box-shadow: var(--ui-shadow-xs, 0 1px 2px rgb(0 0 0 / 0.05));
 }
-.selector[data-v-af4935bb] {
+.selector[data-v-0de9cbcc] {
   border-radius: var(--ui-radius-round);
 }
-.selector[data-v-af4935bb]::before {
+.selector[data-v-0de9cbcc]::before {
   content: "";
   position: absolute;
   inset: 50% auto auto 50%;
   border-radius: var(--ui-radius-round);
   background: var(--ui-affordance-guide-color, var(--ui-border-strong));
-  opacity: var(--ui-affordance-guide-opacity);
+  opacity: calc(var(--ui-affordance-guide-opacity) * var(--ui-affordance-scope-guide, 1));
   transform: translate(-50%, -50%);
   transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);
   pointer-events: none;
 }
-.selector .glyph[data-v-af4935bb] {
+.selector .glyph[data-v-0de9cbcc] {
   display: block;
   width: 14px;
   height: 14px;
@@ -2873,55 +2879,55 @@ from {
     opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),
     transform var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);
 }
-.selector[data-v-af4935bb]:hover::before,
-.selector[data-v-af4935bb]:focus-visible::before {
+.selector[data-v-0de9cbcc]:hover::before,
+.selector[data-v-0de9cbcc]:focus-visible::before {
   opacity: 0;
 }
-.selector:hover .glyph[data-v-af4935bb],
-.selector:focus-visible .glyph[data-v-af4935bb] {
+.selector:hover .glyph[data-v-0de9cbcc],
+.selector:focus-visible .glyph[data-v-0de9cbcc] {
   opacity: 1;
   transform: scale(1);
 }
-.selector.row[data-v-af4935bb] {
+.selector.row[data-v-0de9cbcc] {
   left: -9px;
   width: 18px;
   height: 32px;
   transform: translateY(-50%);
 }
-.selector.row[data-v-af4935bb]::before {
+.selector.row[data-v-0de9cbcc]::before {
   width: 2px;
   height: 16px;
 }
-.selector.column[data-v-af4935bb] {
+.selector.column[data-v-0de9cbcc] {
   top: -9px;
   width: 32px;
   height: 18px;
   transform: translateX(-50%);
 }
-.selector.column[data-v-af4935bb]::before {
+.selector.column[data-v-0de9cbcc]::before {
   width: 16px;
   height: 2px;
 }
 @media (hover: none), (pointer: coarse) {
-.selector[data-v-af4935bb]::before {
+.selector[data-v-0de9cbcc]::before {
     opacity: 0;
 }
-.selector .glyph[data-v-af4935bb] {
+.selector .glyph[data-v-0de9cbcc] {
     opacity: 1;
     transform: none;
 }
 }
-.cell-menu[data-v-af4935bb] {
+.cell-menu[data-v-0de9cbcc] {
   width: 24px;
   height: 24px;
   border-radius: var(--ui-radius-sm);
   background: color-mix(in srgb, var(--ui-surface-muted) 78%, transparent);
 }
-.cell-menu[data-v-af4935bb] {
+.cell-menu[data-v-0de9cbcc] {
   --_ui-default-icon-size: 15px;
   --_ui-default-icon-stroke-width: 2;
 }
-[data-component~="ui-editor-table-overlay"][hidden][data-v-af4935bb] {
+[data-component~="ui-editor-table-overlay"][hidden][data-v-0de9cbcc] {
   display: none;
 }
 
@@ -3478,7 +3484,7 @@ svg[data-v-03a5b772-s] {
   syntax: "*";
   inherits: false;
 }
-[data-component~="ui-icon-button"][data-v-027d9fcb] {
+[data-component~="ui-icon-button"][data-v-a20a82b7] {
   /* Hooks do not inherit, so the parts below read them from the root. */
   --_ui-icon-button-icon-size: var(--ui-icon-button-icon-size);
   --_ui-icon-button-icon-stroke-width: var(--ui-icon-button-icon-stroke-width);
@@ -3486,10 +3492,10 @@ svg[data-v-03a5b772-s] {
   display: inline-flex;
   color: var(--ui-text-secondary);
 }
-[data-component~="ui-icon-button"][data-ui-icon-button-state~="anticipatory"][data-v-027d9fcb] {
+[data-component~="ui-icon-button"][data-ui-icon-button-state~="anticipatory"][data-v-a20a82b7] {
   position: relative;
 }
-[data-component~="ui-icon-button"][data-ui-icon-button-state~="anticipatory"][data-v-027d9fcb]::before {
+[data-component~="ui-icon-button"][data-ui-icon-button-state~="anticipatory"][data-v-a20a82b7]::before {
   content: "";
   position: absolute;
   inset: 50% auto auto 50%;
@@ -3498,7 +3504,7 @@ svg[data-v-03a5b772-s] {
   block-size: var(--ui-affordance-guide-size);
   border-radius: var(--ui-radius-round);
   background: var(--ui-affordance-guide-color, var(--ui-border-strong));
-  opacity: var(--ui-affordance-guide-opacity);
+  opacity: calc(var(--ui-affordance-guide-opacity) * var(--ui-affordance-scope-guide, 1));
   transform: translate(-50%, -50%);
   transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);
   pointer-events: none;
@@ -3508,17 +3514,17 @@ svg[data-v-03a5b772-s] {
  * surface and icon. The root is the native button, so hiding it outright would hide the dot
  * too, and slotted icons sit outside this scope; `color: transparent` hides currentColor icons. */
 @media (hover: hover) and (pointer: fine) {
-[data-component~="ui-icon-button"][data-ui-icon-button-state~="anticipatory"][data-v-027d9fcb]:not([data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=solid"], [data-ui-proximity="near"], :hover, :focus-visible) {
+[data-component~="ui-icon-button"][data-ui-icon-button-state~="anticipatory"][data-v-a20a82b7]:not([data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=solid"], [data-ui-proximity="near"], :hover, :focus-visible) {
     border-color: transparent;
     background: transparent;
     box-shadow: none;
     color: transparent;
 }
 }
-[data-component~="ui-icon-button"][data-ui-icon-button-state~="anticipatory"][data-v-027d9fcb]:is([data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=solid"], [data-ui-proximity="near"], :hover, :focus-visible)::before {
+[data-component~="ui-icon-button"][data-ui-icon-button-state~="anticipatory"][data-v-a20a82b7]:is([data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=solid"], [data-ui-proximity="near"], :hover, :focus-visible)::before {
   opacity: 0;
 }
-[data-component~="ui-icon-button"][data-v-027d9fcb] {
+[data-component~="ui-icon-button"][data-v-a20a82b7] {
   /* The size prop resolves here; --ui-icon-button-size overrides it on an element. */
   --_size: 2rem;
   appearance: none;
@@ -3544,7 +3550,7 @@ svg[data-v-03a5b772-s] {
     transform var(--ui-motion-fast) var(--ui-motion-ease);
 }
 @media (hover: none), (pointer: coarse) {
-[data-component~="ui-icon-button"][data-ui-icon-button-state~="anticipatory"][data-v-027d9fcb]::before {
+[data-component~="ui-icon-button"][data-ui-icon-button-state~="anticipatory"][data-v-a20a82b7]::before {
     opacity: 0;
 }
 }
@@ -3552,10 +3558,10 @@ svg[data-v-03a5b772-s] {
 /* A touch target without a bigger button: an invisible hit area, at least the control
    minimum, centred on the button (::before is the anticipatory guide). */
 @media (pointer: coarse) {
-[data-component~="ui-icon-button"][data-v-027d9fcb] {
+[data-component~="ui-icon-button"][data-v-a20a82b7] {
     position: relative;
 }
-[data-component~="ui-icon-button"][data-v-027d9fcb]::after {
+[data-component~="ui-icon-button"][data-v-a20a82b7]::after {
     content: "";
     position: absolute;
     inset: 50% auto auto 50%;
@@ -3564,10 +3570,10 @@ svg[data-v-03a5b772-s] {
     transform: translate(-50%, -50%);
 }
 }
-html[data-ui-input-modality="touch"] [data-component~="ui-icon-button"][data-v-027d9fcb] {
+html[data-ui-input-modality="touch"] [data-component~="ui-icon-button"][data-v-a20a82b7] {
   position: relative;
 }
-html[data-ui-input-modality="touch"] [data-component~="ui-icon-button"][data-v-027d9fcb]::after {
+html[data-ui-input-modality="touch"] [data-component~="ui-icon-button"][data-v-a20a82b7]::after {
   content: "";
   position: absolute;
   inset: 50% auto auto 50%;
@@ -3575,29 +3581,29 @@ html[data-ui-input-modality="touch"] [data-component~="ui-icon-button"][data-v-0
   block-size: max(100%, var(--ui-control-min-block-size));
   transform: translate(-50%, -50%);
 }
-[data-component~="ui-icon-button"][data-ui-icon-button-state~="size=sm"][data-v-027d9fcb] {
+[data-component~="ui-icon-button"][data-ui-icon-button-state~="size=sm"][data-v-a20a82b7] {
   --_size: 1.75rem;
   inline-size: var(--ui-icon-button-size, var(--_size));
   block-size: var(--ui-icon-button-size, var(--_size));
   min-inline-size: var(--ui-icon-button-size, var(--_size));
   min-block-size: var(--ui-icon-button-size, var(--_size));
 }
-[data-component~="ui-icon-button"][data-ui-icon-button-state~="size=lg"][data-v-027d9fcb] {
+[data-component~="ui-icon-button"][data-ui-icon-button-state~="size=lg"][data-v-a20a82b7] {
   --_size: 2.5rem;
   inline-size: var(--ui-icon-button-size, var(--_size));
   block-size: var(--ui-icon-button-size, var(--_size));
   min-inline-size: var(--ui-icon-button-size, var(--_size));
   min-block-size: var(--ui-icon-button-size, var(--_size));
 }
-[data-component~="ui-icon-button"][data-ui-icon-button-state~="round"][data-v-027d9fcb] {
+[data-component~="ui-icon-button"][data-ui-icon-button-state~="round"][data-v-a20a82b7] {
   border-radius: var(--ui-radius-round);
 }
-[data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=outline"][data-v-027d9fcb] {
+[data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=outline"][data-v-a20a82b7] {
   border-color: var(--ui-icon-button-border, var(--ui-border-default));
   background: var(--ui-icon-button-outline-surface, var(--ui-surface-default));
   color: var(--ui-icon-button-outline-text, var(--ui-text-primary));
 }
-[data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=solid"][data-v-027d9fcb] {
+[data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=solid"][data-v-a20a82b7] {
   background: var(--ui-icon-button-solid-surface, var(--ui-accent-solid));
   color: var(--ui-icon-button-solid-text, var(--ui-text-on-accent));
   box-shadow: var(
@@ -3605,43 +3611,43 @@ html[data-ui-input-modality="touch"] [data-component~="ui-icon-button"][data-v-0
     0 1px 2px color-mix(in srgb, var(--ui-accent-solid) 18%, transparent)
   );
 }
-[data-component~="ui-icon-button"][data-v-027d9fcb]:hover:enabled {
+[data-component~="ui-icon-button"][data-v-a20a82b7]:hover:enabled {
   /* Derived from the text colour so the ghost hover shows on any background. */
   background: var(--ui-icon-button-hover-surface, color-mix(in srgb, currentColor 8%, transparent));
   color: var(--ui-icon-button-hover-text, var(--ui-text-primary));
 }
-[data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=outline"][data-v-027d9fcb]:hover:enabled {
+[data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=outline"][data-v-a20a82b7]:hover:enabled {
   border-color: var(--ui-icon-button-hover-border, var(--ui-border-strong));
 }
-[data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=solid"][data-v-027d9fcb]:hover:enabled {
+[data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=solid"][data-v-a20a82b7]:hover:enabled {
   background: var(--ui-icon-button-solid-hover-surface, var(--ui-accent-hover));
 }
-[data-component~="ui-icon-button"][data-v-027d9fcb]:active:enabled {
+[data-component~="ui-icon-button"][data-v-a20a82b7]:active:enabled {
   transform: scale(var(--ui-icon-button-active-scale, 0.96));
 }
-[data-component~="ui-icon-button"][data-v-027d9fcb]:focus-visible {
+[data-component~="ui-icon-button"][data-v-a20a82b7]:focus-visible {
   outline: none;
   box-shadow: var(--ui-focus-halo);
 }
 
 /* Disabled colours fall back to each variant's own; ghost takes only the icon colour. */
 /* Disabled washes the button out the way Button does: the same shape, one filter. */
-[data-component~="ui-icon-button"][data-v-027d9fcb]:disabled {
+[data-component~="ui-icon-button"][data-v-a20a82b7]:disabled {
   filter: var(--ui-icon-button-disabled-filter, var(--ui-disabled-filter));
   opacity: var(--ui-icon-button-disabled-opacity, 1);
   cursor: not-allowed;
   box-shadow: none;
 }
-[data-component~="ui-icon-button"][data-v-027d9fcb] {
+[data-component~="ui-icon-button"][data-v-a20a82b7] {
   --_icon-button-icon-default: var(--ui-icon-size-md);
 }
-[data-component~="ui-icon-button"][data-ui-icon-button-state~="size=sm"][data-v-027d9fcb] {
+[data-component~="ui-icon-button"][data-ui-icon-button-state~="size=sm"][data-v-a20a82b7] {
   --_icon-button-icon-default: var(--ui-icon-size-sm);
 }
-[data-component~="ui-icon-button"][data-ui-icon-button-state~="size=lg"][data-v-027d9fcb] {
+[data-component~="ui-icon-button"][data-ui-icon-button-state~="size=lg"][data-v-a20a82b7] {
   --_icon-button-icon-default: var(--ui-icon-size-lg);
 }
-svg[data-v-027d9fcb-s] {
+svg[data-v-a20a82b7-s] {
   inline-size: var(--_ui-icon-button-icon-size, var(--_icon-button-icon-default));
   block-size: var(--_ui-icon-button-icon-size, var(--_icon-button-icon-default));
   flex-shrink: 0;
@@ -3649,7 +3655,7 @@ svg[data-v-027d9fcb-s] {
 }
 
 /* A component that sets its display still honours the hidden attribute on its root. */
-[data-component~="ui-icon-button"][hidden][data-v-027d9fcb] {
+[data-component~="ui-icon-button"][hidden][data-v-a20a82b7] {
   display: none;
 }
 
@@ -5270,7 +5276,7 @@ dialog[data-v-40145d41] {
   syntax: "*";
   inherits: false;
 }
-[data-component~="ui-sidebar"][data-v-eff27033] {
+[data-component~="ui-sidebar"][data-v-6929aec9] {
   /* Hooks do not inherit, so the parts below read them from the root. */
   --_ui-sidebar-backdrop: var(--ui-sidebar-backdrop);
 
@@ -5285,14 +5291,14 @@ dialog[data-v-40145d41] {
   background: var(--ui-sidebar-surface, var(--ui-surface-default));
   border-inline-end: 1px solid var(--ui-sidebar-border, var(--ui-border-default));
 }
-[data-component~="ui-sidebar"][data-ui-sidebar-state~="side=end"][data-v-eff27033] {
+[data-component~="ui-sidebar"][data-ui-sidebar-state~="side=end"][data-v-6929aec9] {
   border-inline-end: 0;
   border-inline-start: 1px solid var(--ui-sidebar-border, var(--ui-border-default));
 }
 
 /* The panel's content scrolls, and each edge that hides content fades: the scroll fade every
    Looma scroller uses (see ui-scroll-area). */
-.content[data-v-eff27033] {
+.content[data-v-6929aec9] {
   flex: 1;
   min-block-size: 0;
   overflow: auto;
@@ -5319,10 +5325,10 @@ dialog[data-v-40145d41] {
 }
 
 /* Collapsed while docked. */
-[data-component~="ui-sidebar"][data-ui-sidebar-state~="internalCollapsed"][data-v-eff27033]:not([popover]) {
+[data-component~="ui-sidebar"][data-ui-sidebar-state~="internalCollapsed"][data-v-6929aec9]:not([popover]) {
   display: none;
 }
-.resizer[data-v-eff27033] {
+.resizer[data-v-6929aec9] {
   position: absolute;
   z-index: 1;
   inset-block: 0;
@@ -5335,15 +5341,15 @@ dialog[data-v-40145d41] {
   touch-action: none;
   outline: none;
 }
-.resizer[hidden][data-v-eff27033] {
+.resizer[hidden][data-v-6929aec9] {
   display: none;
 }
-[data-component~="ui-sidebar"][data-ui-sidebar-state~="side=end"] .resizer[data-v-eff27033] {
+[data-component~="ui-sidebar"][data-ui-sidebar-state~="side=end"] .resizer[data-v-6929aec9] {
   inset-inline-end: auto;
   inset-inline-start: 0;
   transform: translateX(-50%);
 }
-.resizer[data-v-eff27033]::after {
+.resizer[data-v-6929aec9]::after {
   content: "";
   position: absolute;
   inset-block: 0;
@@ -5354,12 +5360,12 @@ dialog[data-v-40145d41] {
     var(--ui-affordance-guide-color, var(--ui-border-strong)) 45%,
     transparent
   );
-  opacity: var(--ui-affordance-guide-opacity);
+  opacity: calc(var(--ui-affordance-guide-opacity) * var(--ui-affordance-scope-guide, 1));
   transition:
     background-color var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),
     opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);
 }
-.guide[data-v-eff27033] {
+.guide[data-v-6929aec9] {
   position: absolute;
   inset-block-start: 50%;
   inset-inline-start: 50%;
@@ -5373,16 +5379,16 @@ dialog[data-v-40145d41] {
   transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);
   pointer-events: none;
 }
-.resizer[data-v-eff27033]:is(:hover, :focus-visible)::after {
+.resizer[data-v-6929aec9]:is(:hover, :focus-visible)::after {
   background: var(--ui-affordance-direct-color, var(--ui-accent-solid, var(--ui-focus-ring)));
   opacity: 1;
 }
-.resizer:is(:hover, :focus-visible) > .guide[data-v-eff27033] {
+.resizer:is(:hover, :focus-visible) > .guide[data-v-6929aec9] {
   opacity: 1;
 }
 
 /* Drawer: a popover in the top layer, sliding in from its edge. Closed popovers are hidden by the UA. */
-[data-component~="ui-sidebar"][popover][data-v-eff27033] {
+[data-component~="ui-sidebar"][popover][data-v-6929aec9] {
   position: fixed;
   inset-block: 0;
   inset-inline-start: 0;
@@ -5402,36 +5408,36 @@ dialog[data-v-40145d41] {
 }
 
 /* The author display above would otherwise override the UA rule that hides a closed popover. */
-[data-component~="ui-sidebar"][popover][data-v-eff27033]:not(:popover-open) {
+[data-component~="ui-sidebar"][popover][data-v-6929aec9]:not(:popover-open) {
   display: none;
   transform: translateX(-100%);
 }
-[data-component~="ui-sidebar"][data-ui-sidebar-state~="side=end"][popover][data-v-eff27033] {
+[data-component~="ui-sidebar"][data-ui-sidebar-state~="side=end"][popover][data-v-6929aec9] {
   inset-inline-start: auto;
   inset-inline-end: 0;
 }
-[data-component~="ui-sidebar"][data-ui-sidebar-state~="side=end"][popover][data-v-eff27033]:not(:popover-open) {
+[data-component~="ui-sidebar"][data-ui-sidebar-state~="side=end"][popover][data-v-6929aec9]:not(:popover-open) {
   transform: translateX(100%);
 }
 @starting-style {
-[data-component~="ui-sidebar"][popover][data-v-eff27033]:popover-open {
+[data-component~="ui-sidebar"][popover][data-v-6929aec9]:popover-open {
     transform: translateX(-100%);
 }
-[data-component~="ui-sidebar"][data-ui-sidebar-state~="side=end"][popover][data-v-eff27033]:popover-open {
+[data-component~="ui-sidebar"][data-ui-sidebar-state~="side=end"][popover][data-v-6929aec9]:popover-open {
     transform: translateX(100%);
 }
 }
-[data-component~="ui-sidebar"][popover][data-v-eff27033]::backdrop {
+[data-component~="ui-sidebar"][popover][data-v-6929aec9]::backdrop {
   background: var(--_ui-sidebar-backdrop, rgb(0 0 0 / 0.32));
 }
 @media (prefers-reduced-motion: reduce) {
-[data-component~="ui-sidebar"][popover][data-v-eff27033] {
+[data-component~="ui-sidebar"][popover][data-v-6929aec9] {
     transition: none;
 }
 }
 
 /* A component that sets its display still honours the hidden attribute on its root. */
-[data-component~="ui-sidebar"][hidden][data-v-eff27033] {
+[data-component~="ui-sidebar"][hidden][data-v-6929aec9] {
   display: none;
 }