@itwin/itwinui-css 0.46.0 → 0.48.1

package/css/all.css

@@ -483,6 +483,8 @@ html.iui-theme-dark{
       outline-color:var(--iui-color-foreground-primary); }
 
 .iui-badge{
+  --iui-badge-background-color:#C7CCD1;
+  --_iui-badge-text-color:rgba(0, 0, 0, 0.6);
   margin:0;
   padding:0;
   border:none;
@@ -492,8 +494,8 @@ html.iui-theme-dark{
   padding:0 6px;
   margin:6px 0;
   border-radius:3px;
-  background-color:var(--badge-color, #C7CCD1);
-  color:var(--badge-text-color, rgba(0, 0, 0, 0.6));
+  background-color:var(--iui-badge-background-color);
+  color:var(--_iui-badge-text-color);
   text-transform:uppercase;
   -webkit-user-select:none;
      -moz-user-select:none;
@@ -643,6 +645,7 @@ html.iui-theme-dark{
       fill:var(--iui-icons-color-negative); }
 
 .iui-button{
+  --_iui-button-active-stripe-inset:initial;
   margin:0;
   padding:0;
   border:none;
@@ -697,6 +700,13 @@ html.iui-theme-dark{
     background:var(--iui-color-background-disabled);
     border-color:var(--iui-color-background-disabled);
     color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
+  .iui-button.iui-active::after{
+    content:'';
+    position:absolute;
+    inset:var(--_iui-button-active-stripe-inset);
+    background-color:var(--iui-color-foreground-primary); }
+  .iui-button.iui-active[disabled]::after, .iui-button.iui-active:disabled::after{
+    background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
   .iui-button.iui-default{
     background-color:#FFF;
     border-color:rgba(0, 0, 0, 0.4);
@@ -903,133 +913,61 @@ html.iui-theme-dark{
   isolation:isolate; }
   .iui-button-group > *{
     display:flex; }
-    .iui-button-group > * input, .iui-button-group > * button{
+    .iui-button-group > * .iui-input-container, .iui-button-group > * .iui-button, .iui-button-group > * .iui-input:where(:not(.iui-input-container .iui-input)){
       position:relative;
-      transition-duration:0ms; }
-      .iui-button-group > * input:hover, .iui-button-group > * button:hover{
+      --_iui-button-active-stripe-inset:2px 2px calc(100% - 4px); }
+      .iui-button-group > * .iui-input-container:hover, .iui-button-group > * .iui-button:hover, .iui-button-group > * .iui-input:where(:not(.iui-input-container .iui-input)):hover{
         z-index:1; }
-      .iui-button-group > * input:focus, .iui-button-group > * button:focus{
+      .iui-button-group > * .iui-input-container:focus, .iui-button-group > * .iui-input-container:focus-within, .iui-button-group > * .iui-button:focus, .iui-button-group > * .iui-button:focus-within, .iui-button-group > * .iui-input:where(:not(.iui-input-container .iui-input)):focus, .iui-button-group > * .iui-input:where(:not(.iui-input-container .iui-input)):focus-within{
         z-index:2; }
-        .iui-button-group > * input:focus:where(:not(:focus-visible):not(:hover)), .iui-button-group > * button:focus:where(:not(:focus-visible):not(:hover)){
-          z-index:revert; }
-      .iui-button-group > * input:disabled, .iui-button-group > * button:disabled{
+      .iui-button-group > * .iui-input-container:disabled, .iui-button-group > * .iui-input-container.iui-disabled, .iui-button-group > * .iui-input-container[aria-disabled="true"], .iui-button-group > * .iui-button:disabled, .iui-button-group > * .iui-button.iui-disabled, .iui-button-group > * .iui-button[aria-disabled="true"], .iui-button-group > * .iui-input:where(:not(.iui-input-container .iui-input)):disabled, .iui-button-group > * .iui-input:where(:not(.iui-input-container .iui-input)).iui-disabled, .iui-button-group > * .iui-input:where(:not(.iui-input-container .iui-input))[aria-disabled="true"]{
         z-index:-1; }
-      .iui-button-group > * input:hover, .iui-button-group > * input:focus, .iui-button-group > * button:hover, .iui-button-group > * button:focus{
+    .iui-button-group > * .iui-input, .iui-button-group > * .iui-button:where(:not(.iui-borderless)){
+      border-radius:0;
+      transition-duration:0ms; }
+      .iui-button-group > * .iui-input:hover, .iui-button-group > * .iui-input:focus, .iui-button-group > * .iui-button:where(:not(.iui-borderless)):hover, .iui-button-group > * .iui-button:where(:not(.iui-borderless)):focus{
         transition-duration:0.2s; }
-      .iui-button-group > * input.iui-active::after, .iui-button-group > * button.iui-active::after{
-        content:'';
-        position:absolute;
-        height:2px;
-        opacity:1;
-        top:2px;
-        left:2px;
-        width:calc(100% - 4px);
-        background-color:#008BE1;
-        background-color:var(--iui-color-foreground-primary); }
-      .iui-button-group > * input.iui-active:disabled::after, .iui-button-group > * button.iui-active:disabled::after{
-        background-color:rgba(0, 0, 0, 0.2);
-        background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
-      .iui-button-group > * input:not(.iui-borderless), .iui-button-group > * button:not(.iui-borderless){
-        border-radius:0; }
-    .iui-button-group > *:first-child input, .iui-button-group > *:first-child button:not(.iui-borderless){
+    .iui-button-group > *:first-child .iui-input, .iui-button-group > *:first-child .iui-button:where(:not(.iui-borderless)){
       border-top-left-radius:3px;
       border-bottom-left-radius:3px; }
-    .iui-button-group > *:last-child input, .iui-button-group > *:last-child button:not(.iui-borderless){
+    .iui-button-group > *:last-child .iui-input, .iui-button-group > *:last-child .iui-button:where(:not(.iui-borderless)){
       border-top-right-radius:3px;
       border-bottom-right-radius:3px; }
     .iui-button-group > * + *{
       margin-left:-1px; }
-    .iui-button-group > *:not(:first-child) .iui-default:disabled{
+    .iui-button-group > *:not(:first-child) :where(.iui-button.iui-default):disabled, .iui-button-group > *:not(:first-child) :where(.iui-button.iui-default).iui-disabled, .iui-button-group > *:not(:first-child) :where(.iui-button.iui-default)[aria-disabled="true"]{
       border-left-color:#DCE0E3;
       border-left-color:var(--iui-color-background-4); }
 
 .iui-button-split-menu{
-  display:inline-flex;
-  align-items:center;
-  isolation:isolate;
   display:inline-flex;
   align-items:center;
   isolation:isolate; }
   .iui-button-split-menu > *{
     display:flex; }
-    .iui-button-split-menu > * input, .iui-button-split-menu > * button{
+    .iui-button-split-menu > * .iui-input-container, .iui-button-split-menu > * .iui-button, .iui-button-split-menu > * .iui-input:where(:not(.iui-input-container .iui-input)){
       position:relative;
-      transition-duration:0ms; }
-      .iui-button-split-menu > * input:hover, .iui-button-split-menu > * button:hover{
+      --_iui-button-active-stripe-inset:2px 2px calc(100% - 4px); }
+      .iui-button-split-menu > * .iui-input-container:hover, .iui-button-split-menu > * .iui-button:hover, .iui-button-split-menu > * .iui-input:where(:not(.iui-input-container .iui-input)):hover{
         z-index:1; }
-      .iui-button-split-menu > * input:focus, .iui-button-split-menu > * button:focus{
+      .iui-button-split-menu > * .iui-input-container:focus, .iui-button-split-menu > * .iui-input-container:focus-within, .iui-button-split-menu > * .iui-button:focus, .iui-button-split-menu > * .iui-button:focus-within, .iui-button-split-menu > * .iui-input:where(:not(.iui-input-container .iui-input)):focus, .iui-button-split-menu > * .iui-input:where(:not(.iui-input-container .iui-input)):focus-within{
         z-index:2; }
-        .iui-button-split-menu > * input:focus:where(:not(:focus-visible):not(:hover)), .iui-button-split-menu > * button:focus:where(:not(:focus-visible):not(:hover)){
-          z-index:revert; }
-      .iui-button-split-menu > * input:disabled, .iui-button-split-menu > * button:disabled{
+      .iui-button-split-menu > * .iui-input-container:disabled, .iui-button-split-menu > * .iui-input-container.iui-disabled, .iui-button-split-menu > * .iui-input-container[aria-disabled="true"], .iui-button-split-menu > * .iui-button:disabled, .iui-button-split-menu > * .iui-button.iui-disabled, .iui-button-split-menu > * .iui-button[aria-disabled="true"], .iui-button-split-menu > * .iui-input:where(:not(.iui-input-container .iui-input)):disabled, .iui-button-split-menu > * .iui-input:where(:not(.iui-input-container .iui-input)).iui-disabled, .iui-button-split-menu > * .iui-input:where(:not(.iui-input-container .iui-input))[aria-disabled="true"]{
         z-index:-1; }
-      .iui-button-split-menu > * input:hover, .iui-button-split-menu > * input:focus, .iui-button-split-menu > * button:hover, .iui-button-split-menu > * button:focus{
-        transition-duration:0.2s; }
-      .iui-button-split-menu > * input.iui-active::after, .iui-button-split-menu > * button.iui-active::after{
-        content:'';
-        position:absolute;
-        height:2px;
-        opacity:1;
-        top:2px;
-        left:2px;
-        width:calc(100% - 4px);
-        background-color:#008BE1;
-        background-color:var(--iui-color-foreground-primary); }
-      .iui-button-split-menu > * input.iui-active:disabled::after, .iui-button-split-menu > * button.iui-active:disabled::after{
-        background-color:rgba(0, 0, 0, 0.2);
-        background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
-      .iui-button-split-menu > * input:not(.iui-borderless), .iui-button-split-menu > * button:not(.iui-borderless){
-        border-radius:0; }
-    .iui-button-split-menu > *:first-child input, .iui-button-split-menu > *:first-child button:not(.iui-borderless){
-      border-top-left-radius:3px;
-      border-bottom-left-radius:3px; }
-    .iui-button-split-menu > *:last-child input, .iui-button-split-menu > *:last-child button:not(.iui-borderless){
-      border-top-right-radius:3px;
-      border-bottom-right-radius:3px; }
-    .iui-button-split-menu > * + *{
-      margin-left:-1px; }
-    .iui-button-split-menu > *:not(:first-child) .iui-default:disabled{
-      border-left-color:#DCE0E3;
-      border-left-color:var(--iui-color-background-4); }
-  .iui-button-split-menu > *{
-    display:flex; }
-    .iui-button-split-menu > * input, .iui-button-split-menu > * button{
-      position:relative;
+    .iui-button-split-menu > * .iui-input, .iui-button-split-menu > * .iui-button:where(:not(.iui-borderless)){
+      border-radius:0;
       transition-duration:0ms; }
-      .iui-button-split-menu > * input:hover, .iui-button-split-menu > * button:hover{
-        z-index:1; }
-      .iui-button-split-menu > * input:focus, .iui-button-split-menu > * button:focus{
-        z-index:2; }
-        .iui-button-split-menu > * input:focus:where(:not(:focus-visible):not(:hover)), .iui-button-split-menu > * button:focus:where(:not(:focus-visible):not(:hover)){
-          z-index:revert; }
-      .iui-button-split-menu > * input:disabled, .iui-button-split-menu > * button:disabled{
-        z-index:-1; }
-      .iui-button-split-menu > * input:hover, .iui-button-split-menu > * input:focus, .iui-button-split-menu > * button:hover, .iui-button-split-menu > * button:focus{
+      .iui-button-split-menu > * .iui-input:hover, .iui-button-split-menu > * .iui-input:focus, .iui-button-split-menu > * .iui-button:where(:not(.iui-borderless)):hover, .iui-button-split-menu > * .iui-button:where(:not(.iui-borderless)):focus{
         transition-duration:0.2s; }
-      .iui-button-split-menu > * input.iui-active::after, .iui-button-split-menu > * button.iui-active::after{
-        content:'';
-        position:absolute;
-        height:2px;
-        opacity:1;
-        top:2px;
-        left:2px;
-        width:calc(100% - 4px);
-        background-color:#008BE1;
-        background-color:var(--iui-color-foreground-primary); }
-      .iui-button-split-menu > * input.iui-active:disabled::after, .iui-button-split-menu > * button.iui-active:disabled::after{
-        background-color:rgba(0, 0, 0, 0.2);
-        background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
-      .iui-button-split-menu > * input:not(.iui-borderless), .iui-button-split-menu > * button:not(.iui-borderless){
-        border-radius:0; }
-    .iui-button-split-menu > *:first-child input, .iui-button-split-menu > *:first-child button:not(.iui-borderless){
+    .iui-button-split-menu > *:first-child .iui-input, .iui-button-split-menu > *:first-child .iui-button:where(:not(.iui-borderless)){
       border-top-left-radius:3px;
       border-bottom-left-radius:3px; }
-    .iui-button-split-menu > *:last-child input, .iui-button-split-menu > *:last-child button:not(.iui-borderless){
+    .iui-button-split-menu > *:last-child .iui-input, .iui-button-split-menu > *:last-child .iui-button:where(:not(.iui-borderless)){
       border-top-right-radius:3px;
       border-bottom-right-radius:3px; }
     .iui-button-split-menu > * + *{
       margin-left:-1px; }
-    .iui-button-split-menu > *:not(:first-child) .iui-default:disabled{
+    .iui-button-split-menu > *:not(:first-child) :where(.iui-button.iui-default):disabled, .iui-button-split-menu > *:not(:first-child) :where(.iui-button.iui-default).iui-disabled, .iui-button-split-menu > *:not(:first-child) :where(.iui-button.iui-default)[aria-disabled="true"]{
       border-left-color:#DCE0E3;
       border-left-color:var(--iui-color-background-4); }
   .iui-button-split-menu:hover{
@@ -1243,6 +1181,7 @@ html.iui-theme-dark{
         color:var(--iui-text-color-muted); }
 
 .iui-color-picker{
+  --iui-color-picker-selected-color:initial;
   margin:0;
   padding:0;
   border:none;
@@ -1323,34 +1262,43 @@ html.iui-theme-dark{
                 appearance:none; }
 
 .iui-color-swatch{
+  --iui-color-swatch-background:initial;
   height:24px;
   width:24px;
   cursor:pointer;
   border-radius:5px;
-  background-color:var(--swatch-color);
   margin-bottom:4px;
   margin-right:4px;
-  box-shadow:inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
-  box-shadow:inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
+  position:relative;
+  background-color:var(--iui-color-swatch-background);
+  background-position:0 0, 8px 8px;
+  background-size:16px 16px;
+  background-image:repeating-linear-gradient(45deg, #EEF0F3 25%, transparent 25%, transparent 75%, #EEF0F3 75%, #EEF0F3), repeating-linear-gradient(45deg, #EEF0F3 25%, #C7CCD1 25%, #C7CCD1 75%, #EEF0F3 75%, #EEF0F3);
+  background-image:repeating-linear-gradient(45deg, var(--iui-color-background-3) 25%, transparent 25%, transparent 75%, var(--iui-color-background-3) 75%, var(--iui-color-background-3)), repeating-linear-gradient(45deg, var(--iui-color-background-3) 25%, var(--iui-color-background-5) 25%, var(--iui-color-background-5) 75%, var(--iui-color-background-3) 75%, var(--iui-color-background-3)); }
   @supports (gap: 8px){
     .iui-color-swatch{
       margin-bottom:0;
       margin-right:0; } }
+  .iui-color-swatch::after{
+    content:'';
+    position:absolute;
+    width:inherit;
+    height:inherit;
+    border-radius:inherit;
+    background-color:inherit;
+    box-shadow:inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
   .iui-color-swatch:hover{
-    box-shadow:0 0 1px 3px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)), inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
     box-shadow:0 0 1px 3px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)), inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
   .iui-color-swatch:focus-visible{
     outline:2px solid var(--iui-color-foreground-primary);
-    outline-offset:0; }
+    outline-offset:1px; }
   @supports not selector(*:focus-visible){
     .iui-color-swatch:focus{
       outline:2px solid var(--iui-color-foreground-primary);
-      outline-offset:0; } }
+      outline-offset:1px; } }
   .iui-color-swatch.iui-active{
-    box-shadow:0 0 0 2px rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-3)), inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
     box-shadow:0 0 0 2px rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-3)), inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
     .iui-color-swatch.iui-active:hover{
-      box-shadow:0 0 1px 3px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)), inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)), 0 0 0 2px rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-3));
       box-shadow:0 0 1px 3px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)), inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)), 0 0 0 2px rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-3)); }
 
 .iui-color-picker-section-label{
@@ -1366,12 +1314,12 @@ html.iui-theme-dark{
   min-width:280px; }
 
 .iui-color-field{
+  --iui-color-field-hue:initial;
   position:relative;
   cursor:crosshair;
   width:100%;
   height:209px;
-  background-image:linear-gradient(0deg, black, transparent), linear-gradient(90deg, white, var(--hue));
-  background-image:linear-gradient(0deg, black, transparent), linear-gradient(90deg, white, var(--hue)); }
+  background-image:linear-gradient(0deg, black, transparent), linear-gradient(90deg, white, var(--iui-color-field-hue)); }
   .iui-color-field:not(:last-child){
     margin-bottom:6px; }
 
@@ -1385,37 +1333,32 @@ html.iui-theme-dark{
 
 .iui-opacity-slider .iui-slider-rail{
   height:8px;
-  background-image:repeating-linear-gradient(45deg, #EEF0F3 25%, transparent 25%, transparent 75%, #EEF0F3 75%, #EEF0F3), repeating-linear-gradient(45deg, #EEF0F3 25%, #C7CCD1 25%, #C7CCD1 75%, #EEF0F3 75%, #EEF0F3);
   background-position:0 0, 4px 4px;
   background-size:8px 8px;
-  background-image:repeating-linear-gradient(45deg, var(--iui-color-background-3) 25%, transparent 25%, transparent 75%, var(--iui-color-background-3) 75%, var(--iui-color-background-3)), repeating-linear-gradient(45deg, var(--iui-color-background-3) 25%, var(--iui-color-background-5) 25%, var(--iui-color-background-5) 75%, var(--iui-color-background-3) 75%, var(--iui-color-background-3));
-  background-position:0 0, 4px 4px;
-  background-size:8px 8px; }
+  background-image:repeating-linear-gradient(45deg, #EEF0F3 25%, transparent 25%, transparent 75%, #EEF0F3 75%, #EEF0F3), repeating-linear-gradient(45deg, #EEF0F3 25%, #C7CCD1 25%, #C7CCD1 75%, #EEF0F3 75%, #EEF0F3);
+  background-image:repeating-linear-gradient(45deg, var(--iui-color-background-3) 25%, transparent 25%, transparent 75%, var(--iui-color-background-3) 75%, var(--iui-color-background-3)), repeating-linear-gradient(45deg, var(--iui-color-background-3) 25%, var(--iui-color-background-5) 25%, var(--iui-color-background-5) 75%, var(--iui-color-background-3) 75%, var(--iui-color-background-3)); }
   .iui-opacity-slider .iui-slider-rail::before{
     display:block;
     content:'';
     width:100%;
     height:100%;
-    background-image:linear-gradient(to right, transparent 0%, var(--selected-color) 100%); }
+    background-image:linear-gradient(to right, transparent 0%, var(--iui-color-picker-selected-color) 100%); }
 
 .iui-opacity-slider .iui-slider-thumb{
   top:7px; }
 
 .iui-color-dot{
+  --iui-color-dot-inset:initial;
   position:absolute;
-  top:var(--top, 0%);
-  left:var(--left, 0%);
+  inset:var(--iui-color-dot-inset);
   width:16px;
   height:16px;
   border-radius:50%;
   transform:translate(-8px, -8px);
   cursor:crosshair;
-  box-shadow:white 0 0 0 1px, inset 0 0 0 1px rgba(255, 255, 255, 0.1);
-  background-color:var(--selected-color);
   box-shadow:rgba(var(--iui-color-foreground-accessory-rgb), var(--iui-opacity-1)) 0 0 0 1px, inset 0 0 0 1px rgba(var(--iui-color-foreground-accessory-rgb), var(--iui-opacity-6));
-  background-color:var(--selected-color); }
+  background-color:var(--iui-color-picker-selected-color); }
   .iui-color-dot:hover{
-    box-shadow:0 0 1px 3px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
     box-shadow:0 0 1px 3px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
   .iui-color-dot:focus-visible{
     outline:2px solid var(--iui-color-foreground-primary);
@@ -1698,6 +1641,18 @@ html.iui-theme-dark{
       margin-left:8px; }
     .iui-expandable-block.iui-small .iui-header > .iui-status-icon{
       margin-left:8px; }
+  .iui-expandable-block.iui-borderless,
+  .iui-expandable-block.iui-borderless .iui-header,
+  .iui-expandable-block.iui-borderless .iui-expandable-content{
+    background-color:transparent;
+    border:initial; }
+  .iui-expandable-block.iui-borderless .iui-header{
+    border-radius:3px; }
+    .iui-expandable-block.iui-borderless .iui-header:hover{
+      background-color:rgba(0, 0, 0, 0.1);
+      background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-6)); }
+  .iui-expandable-block.iui-borderless .iui-expandable-content > div{
+    padding:0; }
 
 .iui-fieldset{
   margin:0;
@@ -2581,8 +2536,8 @@ html.iui-theme-dark{
       cursor:not-allowed; }
   .iui-input-container.iui-disabled label{
     cursor:not-allowed; }
-  .iui-input-container .iui-checkbox,
-  .iui-input-container .iui-radio{
+  .iui-input-container .iui-checkbox-wrapper,
+  .iui-input-container .iui-radio-wrapper{
     min-height:22px; }
   .iui-input-container.iui-inline-label{
     -ms-grid-rows: auto;
@@ -2681,7 +2636,9 @@ html.iui-theme-dark{
       width:fit-content;
       margin-right:0;
       border-top-left-radius:0;
-      border-bottom-left-radius:0; }
+      border-bottom-left-radius:0;
+      border-top-right-radius:inherit;
+      border-bottom-right-radius:inherit; }
     .iui-input-container.iui-inline-icon > .iui-input-icon.iui-actionable{
       align-items:center;
       height:90%;
@@ -3169,7 +3126,9 @@ html.iui-theme-dark{
     width:fit-content;
     margin-right:0;
     border-top-left-radius:0;
-    border-bottom-left-radius:0; }
+    border-bottom-left-radius:0;
+    border-top-right-radius:inherit;
+    border-bottom-right-radius:inherit; }
   .iui-end-icon.iui-actionable{
     align-items:center;
     height:90%;
@@ -3197,308 +3156,313 @@ html.iui-theme-dark{
       fill:var(--iui-icons-color-actionable-disabled); }
 
 .iui-checkbox{
+  --_iui-checkbox-checkmark-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m6.5 12.5-4.5-4.5 1.5-1.5 3 3 6-6 1.5 1.5z" /></svg>');
+  --_iui-checkbox-indeterminate-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m2.75 6.875h10.5v2.25h-10.5z" /></svg>');
+  --_iui-checkbox-unchecked-svg:url('data:image/svg+xml;utf8,<svg viewBox="0 0 16 16"></svg>');
+  --_iui-checkbox-svg-color:var(--iui-color-foreground-primary);
+  --_iui-checkbox-border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
+  --_iui-checkbox-background-color:var(--iui-color-background-1);
+  --_iui-checkbox-mask-image:initial;
+  -webkit-appearance:none;
+     -moz-appearance:none;
+          appearance:none;
   margin:0;
-  padding:0;
-  border:none;
-  vertical-align:baseline;
-  display:flex;
-  align-items:center;
-  font-size:14px;
-  width:-webkit-fit-content;
-  width:-moz-fit-content;
-  width:fit-content;
-  -webkit-user-select:none;
-     -moz-user-select:none;
-      -ms-user-select:none;
-          user-select:none;
+  width:16px;
+  height:16px;
   position:relative;
-  cursor:pointer;
-  color:rgba(0, 0, 0, 0.8);
-  color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2)); }
-  .iui-checkbox > input{
-    width:0;
-    height:0;
-    -webkit-appearance:none;
-       -moz-appearance:none;
-            appearance:none;
-    opacity:0;
-    position:absolute; }
-  .iui-checkbox.iui-disabled{
-    cursor:not-allowed; }
-  .iui-checkbox .iui-checkbox-checkmark,
-  .iui-checkbox .iui-radio-dot{
-    width:16px;
-    height:16px;
+  border-radius:3px;
+  background-color:var(--_iui-checkbox-background-color);
+  cursor:pointer; }
+  .iui-checkbox-wrapper{
     margin:0;
+    padding:0;
+    border:none;
+    vertical-align:baseline;
     display:flex;
-    flex-shrink:0;
-    justify-content:center;
     align-items:center;
+    font-size:14px;
+    width:-webkit-fit-content;
+    width:-moz-fit-content;
+    width:fit-content;
+    -webkit-user-select:none;
+       -moz-user-select:none;
+        -ms-user-select:none;
+            user-select:none;
     position:relative;
-    isolation:isolate;
-    border-color:rgba(0, 0, 0, 0.4);
-    background-color:#FFF;
-    border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
-    background-color:var(--iui-color-background-1); }
-    .iui-checkbox .iui-checkbox-checkmark::after,
-    .iui-checkbox .iui-radio-dot::after{
-      content:'';
-      position:absolute;
-      inset:0;
-      z-index:-1;
-      transition:border-color 0.2s ease-out;
-      border-radius:inherit;
-      border-style:solid;
-      border-width:1px;
-      border-color:inherit; }
-    .iui-checkbox .iui-checkbox-checkmark svg:not(.iui-radial),
-    .iui-checkbox .iui-radio-dot svg:not(.iui-radial){
-      width:100%;
-      height:100%;
-      fill:#008BE1;
-      fill:var(--iui-icons-color-primary); }
-      .iui-checkbox .iui-checkbox-checkmark svg:not(.iui-radial) > *,
-      .iui-checkbox .iui-radio-dot svg:not(.iui-radial) > *{
-        opacity:0; }
-        @media (prefers-reduced-motion: no-preference){
-          .iui-checkbox .iui-checkbox-checkmark svg:not(.iui-radial) > *,
-          .iui-checkbox .iui-radio-dot svg:not(.iui-radial) > *{
-            transition:opacity 0.2s ease; } }
-  .iui-checkbox > .iui-label{
-    margin-right:8px;
-    display:flex;
-    align-items:center; }
-    .iui-checkbox > .iui-label svg{
-      width:16px;
-      height:16px;
-      vertical-align:middle;
-      fill:rgba(0, 0, 0, 0.8);
-      fill:var(--iui-icons-color-actionable); }
-  .iui-checkbox .iui-checkbox-checkmark ~ .iui-label,
-  .iui-checkbox .iui-radio-dot ~ .iui-label{
-    margin-left:8px;
-    margin-right:0; }
-  .iui-checkbox:hover > input:enabled ~ .iui-checkbox-checkmark,
-  .iui-checkbox:hover > input:enabled ~ .iui-radio-dot{
-    border-color:rgba(0, 0, 0, 0.8);
-    border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2)); }
-  .iui-checkbox input:checked ~ .iui-checkbox-checkmark,
-  .iui-checkbox input:indeterminate ~ .iui-checkbox-checkmark,
-  .iui-checkbox input:checked ~ .iui-radio-dot{
-    border-color:rgba(0, 0, 0, 0.6);
-    border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-3)); }
-  .iui-checkbox input:checked ~ .iui-checkbox-checkmark .iui-check,
-  .iui-checkbox input:indeterminate ~ .iui-checkbox-checkmark .iui-check-partial,
-  .iui-checkbox input:checked ~ .iui-radio-dot circle{
-    opacity:1; }
-    @media (prefers-reduced-motion: no-preference){
-      .iui-checkbox input:checked ~ .iui-checkbox-checkmark .iui-check,
-      .iui-checkbox input:indeterminate ~ .iui-checkbox-checkmark .iui-check-partial,
-      .iui-checkbox input:checked ~ .iui-radio-dot circle{
-        transition:opacity 0.2s ease; } }
-  .iui-checkbox input:enabled:focus ~ .iui-checkbox-checkmark,
-  .iui-checkbox input:enabled:focus ~ .iui-radio-dot{
-    outline:2px solid #008BE1;
+    cursor:pointer;
+    color:rgba(0, 0, 0, 0.8);
+    color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
+    gap:8px; }
+    .iui-checkbox-wrapper > * + *{
+      margin-left:8px; }
+      @supports (gap: 8px){
+        .iui-checkbox-wrapper > * + *{
+          margin-left:0; } }
+    .iui-checkbox-wrapper.iui-loading{
+      cursor:wait;
+      color:var(--iui-text-color-muted); }
+    .iui-checkbox-wrapper > .iui-checkbox-label,
+    .iui-checkbox-wrapper > .iui-radio-label{
+      display:flex;
+      align-items:center; }
+      .iui-checkbox-wrapper > .iui-checkbox-label svg,
+      .iui-checkbox-wrapper > .iui-radio-label svg{
+        width:16px;
+        height:16px;
+        vertical-align:middle;
+        fill:currentColor; }
+    .iui-checkbox-wrapper.iui-disabled{
+      cursor:not-allowed;
+      color:var(--iui-text-color-muted); }
+      .iui-checkbox-wrapper.iui-disabled svg{
+        fill:var(--iui-icons-color-actionable-disabled); }
+    .iui-checkbox-wrapper.iui-positive{
+      color:#53A21A;
+      color:var(--iui-color-foreground-positive); }
+    .iui-checkbox-wrapper.iui-warning{
+      color:#F18B12;
+      color:var(--iui-color-foreground-warning); }
+    .iui-checkbox-wrapper.iui-negative{
+      color:#D30A0A;
+      color:var(--iui-color-foreground-negative); }
+  .iui-checkbox::before{
+    content:'';
+    position:absolute;
+    inset:0;
+    transition:border-color 0.2s ease-out;
+    border-radius:inherit;
+    border-style:solid;
+    border-width:1px;
+    border-color:var(--_iui-checkbox-border-color); }
+  .iui-checkbox::after{
+    content:'';
+    position:absolute;
+    inset:0;
+    background-color:var(--_iui-checkbox-svg-color);
+    -webkit-mask:var(--_iui-checkbox-mask-image) no-repeat center;
+            mask:var(--_iui-checkbox-mask-image) no-repeat center; }
+  .iui-checkbox:not(:checked){
+    --_iui-checkbox-mask-image:var(--_iui-checkbox-unchecked-svg); }
+  .iui-checkbox:checked{
+    --_iui-checkbox-border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-3));
+    --_iui-checkbox-mask-image:var(--_iui-checkbox-checkmark-svg); }
+  .iui-checkbox:indeterminate{
+    --_iui-checkbox-border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-3));
+    --_iui-checkbox-mask-image:var(--_iui-checkbox-indeterminate-svg); }
+  .iui-checkbox:hover{
+    --_iui-checkbox-border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2)); }
+  .iui-checkbox:focus-visible{
     outline:2px solid var(--iui-color-foreground-primary);
     outline-offset:-1px; }
-  .iui-checkbox input:enabled:focus:not(:focus-visible) ~ .iui-checkbox-checkmark,
-  .iui-checkbox input:enabled:focus:not(:focus-visible) ~ .iui-radio-dot{
-    outline:none; }
-  .iui-checkbox input:disabled ~ .iui-checkbox-checkmark,
-  .iui-checkbox input:disabled ~ .iui-radio-dot{
-    cursor:not-allowed;
-    background-color:#EEF0F3;
-    border-color:#EEF0F3;
-    background-color:var(--iui-color-background-disabled);
-    border-color:var(--iui-color-background-disabled); }
-  .iui-checkbox input:disabled ~ .iui-checkbox-checkmark svg,
-  .iui-checkbox input:disabled ~ .iui-radio-dot svg{
-    fill:rgba(0, 0, 0, 0.2);
-    fill:var(--iui-icons-color-actionable-disabled); }
-  .iui-checkbox input:disabled ~ .iui-label{
-    cursor:not-allowed;
-    color:rgba(0, 0, 0, 0.4);
-    color:var(--iui-text-color-muted); }
-    .iui-checkbox input:disabled ~ .iui-label svg{
-      fill:rgba(0, 0, 0, 0.2);
-      fill:var(--iui-icons-color-actionable-disabled); }
-  .iui-checkbox.iui-positive{
-    color:#53A21A;
-    color:var(--iui-color-foreground-positive); }
-  .iui-checkbox.iui-warning{
-    color:#F18B12;
-    color:var(--iui-color-foreground-warning); }
-  .iui-checkbox.iui-negative{
-    color:#D30A0A;
-    color:var(--iui-color-foreground-negative); }
-  .iui-checkbox .iui-checkbox-checkmark{
-    border-radius:3px; }
+  @supports not selector(*:focus-visible){
+    .iui-checkbox:focus{
+      outline:2px solid var(--iui-color-foreground-primary);
+      outline-offset:-1px; } }
+  .iui-checkbox.iui-checkbox-visibility{
+    --_iui-checkbox-checkmark-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m8 2.99051a8.81883 8.81883 0 0 0 -8 4.95062 8.74664 8.74664 0 0 0 8 5.06836 8.63266 8.63266 0 0 0 8-5.06836 8.83631 8.83631 0 0 0 -8-4.95062zm-1.31445 1.86981a1.47663 1.47663 0 1 1 -1.47663 1.47668 1.47665 1.47665 0 0 1 1.47663-1.47668zm1.31445 6.64917a7.17486 7.17486 0 0 1 -6.30475-3.55237 7.4952 7.4952 0 0 1 2.81475-2.6336 3.83956 3.83956 0 1 0 6.98126.00244 7.522 7.522 0 0 1 2.81774 2.63916 7.09785 7.09785 0 0 1 -6.309 3.54437z" /></svg>');
+    --_iui-checkbox-indeterminate-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m8 3v7.9a4.01179 4.01179 0 0 0 4-4 6.7509 6.7509 0 0 0 -.2-1.4l.1.1a6.89429 6.89429 0 0 1 2.4 2.4 8.39088 8.39088 0 0 1 -2.3 2.3 6.89412 6.89412 0 0 1 -3.9 1.2c-.03345 0-.06653-.00677-.1-.0072v1.5072a8.90686 8.90686 0 0 0 8-5 8.90686 8.90686 0 0 0 -8-5z" opacity=".33" /><path d="m8 0a1 1 0 0 0 -1 1v2.07135a8.91637 8.91637 0 0 0 -7 4.92865 8.91637 8.91637 0 0 0 7 4.92865v2.07135a1 1 0 0 0 2 0v-14a1 1 0 0 0 -1-1zm-1.5 4.9a1.55426 1.55426 0 0 1 .5.087v2.81451a1.40746 1.40746 0 0 1 -.5.09849 1.538 1.538 0 0 1 -1.5-1.5 1.53794 1.53794 0 0 1 1.5-1.5zm-2.3 5.4a6.97279 6.97279 0 0 1 -2.5-2.3 6.89429 6.89429 0 0 1 2.4-2.4c.1 0 .1-.1.2-.1a3.194 3.194 0 0 0 -.3 1.4 4.0047 4.0047 0 0 0 3 3.857v.65289a6.37491 6.37491 0 0 1 -2.8-1.10989z" /></svg>');
+    --_iui-checkbox-unchecked-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m1.70671 12.879 11.17218-11.17219 1.4142 1.4142-11.17218 11.17218zm.99329-1.679 1.1-1.1a5.06317 5.06317 0 0 1 -2-2.1 7.48268 7.48268 0 0 1 6.2-3.5 4.86877 4.86877 0 0 1 1.2.1l1.3-1.3a10.07431 10.07431 0 0 0 -2.5-.3 8.84129 8.84129 0 0 0 -8 5 8.42455 8.42455 0 0 0 2.7 3.2zm10.7-6.4-1.1 1.1a7.08625 7.08625 0 0 1 2 2.1 7.50323 7.50323 0 0 1 -6.2 3.5 8.31665 8.31665 0 0 1 -1.3-.2l-1.3 1.3a8.909 8.909 0 0 0 6.4-.5 9.04344 9.04344 0 0 0 4.1-4.1 9.168 9.168 0 0 0 -2.6-3.2z" /></svg>');
+    --_iui-checkbox-border-color:transparent;
+    --_iui-checkbox-background-color:transparent; }
+    .iui-checkbox.iui-checkbox-visibility:where(:not(:checked):not(:indeterminate)){
+      --_iui-checkbox-svg-color:var(--iui-icons-color-actionable); }
+    .iui-checkbox.iui-checkbox-visibility:where(:hover){
+      --_iui-checkbox-border-color:transparent;
+      --_iui-checkbox-background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-6)); }
+  .iui-checkbox:disabled{
+    --_iui-checkbox-svg-color:var(--iui-icons-color-actionable-disabled);
+    --_iui-checkbox-border-color:var(--iui-color-background-disabled);
+    --_iui-checkbox-background-color:var(--iui-color-background-disabled);
+    cursor:not-allowed; }
   .iui-checkbox.iui-loading{
+    --_iui-checkbox-border-color:transparent;
+    --_iui-checkbox-background-color:transparent;
+    opacity:0;
+    position:absolute;
     cursor:wait; }
-    .iui-checkbox.iui-loading input ~ .iui-checkbox-checkmark{
-      border-color:transparent;
-      background-color:transparent; }
-    .iui-checkbox.iui-loading input:disabled ~ .iui-checkbox-checkmark{
-      cursor:wait; }
-    .iui-checkbox.iui-loading input:disabled ~ .iui-label{
-      cursor:wait; }
-  .iui-checkbox-visibility:hover > input:enabled ~ .iui-checkbox-checkmark{
-    background-color:rgba(0, 0, 0, 0.1);
-    background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-6)); }
-  .iui-checkbox-visibility input ~ .iui-checkbox-checkmark::after,
-  .iui-checkbox-visibility:hover > input:enabled ~ .iui-checkbox-checkmark::after{
-    border:none; }
-  .iui-checkbox-visibility input ~ .iui-checkbox-checkmark{
-    background-color:transparent; }
-  .iui-checkbox-visibility input:checked ~ .iui-checkbox-checkmark .iui-uncheck,
-  .iui-checkbox-visibility input:indeterminate ~ .iui-checkbox-checkmark .iui-uncheck{
-    opacity:0; }
-  .iui-checkbox-visibility input ~ .iui-checkbox-checkmark .iui-uncheck{
-    opacity:1;
-    transition:opacity 0.2s ease;
-    fill:rgba(0, 0, 0, 0.8);
-    fill:var(--iui-icons-color-actionable); }
-  .iui-checkbox-visibility input:disabled ~ .iui-checkbox-checkmark .iui-uncheck{
-    fill:rgba(0, 0, 0, 0.2);
-    fill:var(--iui-icons-color-actionable-disabled); }
 
 .iui-radio{
+  --_iui-checkbox-checkmark-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m6.5 12.5-4.5-4.5 1.5-1.5 3 3 6-6 1.5 1.5z" /></svg>');
+  --_iui-checkbox-indeterminate-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m2.75 6.875h10.5v2.25h-10.5z" /></svg>');
+  --_iui-checkbox-unchecked-svg:url('data:image/svg+xml;utf8,<svg viewBox="0 0 16 16"></svg>');
+  --_iui-checkbox-svg-color:var(--iui-color-foreground-primary);
+  --_iui-checkbox-border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
+  --_iui-checkbox-background-color:var(--iui-color-background-1);
+  --_iui-checkbox-mask-image:initial;
+  -webkit-appearance:none;
+     -moz-appearance:none;
+          appearance:none;
   margin:0;
-  padding:0;
-  border:none;
-  vertical-align:baseline;
-  display:flex;
-  align-items:center;
-  font-size:14px;
-  width:-webkit-fit-content;
-  width:-moz-fit-content;
-  width:fit-content;
-  -webkit-user-select:none;
-     -moz-user-select:none;
-      -ms-user-select:none;
-          user-select:none;
+  width:16px;
+  height:16px;
   position:relative;
+  border-radius:3px;
+  background-color:var(--_iui-checkbox-background-color);
   cursor:pointer;
-  color:rgba(0, 0, 0, 0.8);
-  color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2)); }
-  .iui-radio > input{
-    width:0;
-    height:0;
-    -webkit-appearance:none;
-       -moz-appearance:none;
-            appearance:none;
-    opacity:0;
-    position:absolute; }
-  .iui-radio.iui-disabled{
-    cursor:not-allowed; }
-  .iui-radio .iui-checkbox-checkmark,
-  .iui-radio .iui-radio-dot{
-    width:16px;
-    height:16px;
+  border-radius:50%; }
+  .iui-radio-wrapper{
     margin:0;
+    padding:0;
+    border:none;
+    vertical-align:baseline;
     display:flex;
-    flex-shrink:0;
-    justify-content:center;
     align-items:center;
+    font-size:14px;
+    width:-webkit-fit-content;
+    width:-moz-fit-content;
+    width:fit-content;
+    -webkit-user-select:none;
+       -moz-user-select:none;
+        -ms-user-select:none;
+            user-select:none;
     position:relative;
-    isolation:isolate;
-    border-color:rgba(0, 0, 0, 0.4);
-    background-color:#FFF;
-    border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
-    background-color:var(--iui-color-background-1); }
-    .iui-radio .iui-checkbox-checkmark::after,
-    .iui-radio .iui-radio-dot::after{
-      content:'';
-      position:absolute;
-      inset:0;
-      z-index:-1;
-      transition:border-color 0.2s ease-out;
-      border-radius:inherit;
-      border-style:solid;
-      border-width:1px;
-      border-color:inherit; }
-    .iui-radio .iui-checkbox-checkmark svg:not(.iui-radial),
-    .iui-radio .iui-radio-dot svg:not(.iui-radial){
-      width:100%;
-      height:100%;
-      fill:#008BE1;
-      fill:var(--iui-icons-color-primary); }
-      .iui-radio .iui-checkbox-checkmark svg:not(.iui-radial) > *,
-      .iui-radio .iui-radio-dot svg:not(.iui-radial) > *{
-        opacity:0; }
-        @media (prefers-reduced-motion: no-preference){
-          .iui-radio .iui-checkbox-checkmark svg:not(.iui-radial) > *,
-          .iui-radio .iui-radio-dot svg:not(.iui-radial) > *{
-            transition:opacity 0.2s ease; } }
-  .iui-radio > .iui-label{
-    margin-right:8px;
+    cursor:pointer;
+    color:rgba(0, 0, 0, 0.8);
+    color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
+    gap:8px; }
+    .iui-radio-wrapper > * + *{
+      margin-left:8px; }
+      @supports (gap: 8px){
+        .iui-radio-wrapper > * + *{
+          margin-left:0; } }
+    .iui-radio-wrapper.iui-loading{
+      cursor:wait;
+      color:var(--iui-text-color-muted); }
+    .iui-radio-wrapper > .iui-checkbox-label,
+    .iui-radio-wrapper > .iui-radio-label{
+      display:flex;
+      align-items:center; }
+      .iui-radio-wrapper > .iui-checkbox-label svg,
+      .iui-radio-wrapper > .iui-radio-label svg{
+        width:16px;
+        height:16px;
+        vertical-align:middle;
+        fill:currentColor; }
+    .iui-radio-wrapper.iui-disabled{
+      cursor:not-allowed;
+      color:var(--iui-text-color-muted); }
+      .iui-radio-wrapper.iui-disabled svg{
+        fill:var(--iui-icons-color-actionable-disabled); }
+    .iui-radio-wrapper.iui-positive{
+      color:#53A21A;
+      color:var(--iui-color-foreground-positive); }
+    .iui-radio-wrapper.iui-warning{
+      color:#F18B12;
+      color:var(--iui-color-foreground-warning); }
+    .iui-radio-wrapper.iui-negative{
+      color:#D30A0A;
+      color:var(--iui-color-foreground-negative); }
+  .iui-radio-wrapper{
+    margin:0;
+    padding:0;
+    border:none;
+    vertical-align:baseline;
     display:flex;
-    align-items:center; }
-    .iui-radio > .iui-label svg{
-      width:16px;
-      height:16px;
-      vertical-align:middle;
-      fill:rgba(0, 0, 0, 0.8);
-      fill:var(--iui-icons-color-actionable); }
-  .iui-radio .iui-checkbox-checkmark ~ .iui-label,
-  .iui-radio .iui-radio-dot ~ .iui-label{
-    margin-left:8px;
-    margin-right:0; }
-  .iui-radio:hover > input:enabled ~ .iui-checkbox-checkmark,
-  .iui-radio:hover > input:enabled ~ .iui-radio-dot{
-    border-color:rgba(0, 0, 0, 0.8);
-    border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2)); }
-  .iui-radio input:checked ~ .iui-checkbox-checkmark,
-  .iui-radio input:indeterminate ~ .iui-checkbox-checkmark,
-  .iui-radio input:checked ~ .iui-radio-dot{
-    border-color:rgba(0, 0, 0, 0.6);
-    border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-3)); }
-  .iui-radio input:checked ~ .iui-checkbox-checkmark .iui-check,
-  .iui-radio input:indeterminate ~ .iui-checkbox-checkmark .iui-check-partial,
-  .iui-radio input:checked ~ .iui-radio-dot circle{
-    opacity:1; }
-    @media (prefers-reduced-motion: no-preference){
-      .iui-radio input:checked ~ .iui-checkbox-checkmark .iui-check,
-      .iui-radio input:indeterminate ~ .iui-checkbox-checkmark .iui-check-partial,
-      .iui-radio input:checked ~ .iui-radio-dot circle{
-        transition:opacity 0.2s ease; } }
-  .iui-radio input:enabled:focus ~ .iui-checkbox-checkmark,
-  .iui-radio input:enabled:focus ~ .iui-radio-dot{
-    outline:2px solid #008BE1;
+    align-items:center;
+    font-size:14px;
+    width:-webkit-fit-content;
+    width:-moz-fit-content;
+    width:fit-content;
+    -webkit-user-select:none;
+       -moz-user-select:none;
+        -ms-user-select:none;
+            user-select:none;
+    position:relative;
+    cursor:pointer;
+    color:rgba(0, 0, 0, 0.8);
+    color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
+    gap:8px; }
+    .iui-radio-wrapper > * + *{
+      margin-left:8px; }
+      @supports (gap: 8px){
+        .iui-radio-wrapper > * + *{
+          margin-left:0; } }
+    .iui-radio-wrapper.iui-loading{
+      cursor:wait;
+      color:var(--iui-text-color-muted); }
+    .iui-radio-wrapper > .iui-checkbox-label,
+    .iui-radio-wrapper > .iui-radio-label{
+      display:flex;
+      align-items:center; }
+      .iui-radio-wrapper > .iui-checkbox-label svg,
+      .iui-radio-wrapper > .iui-radio-label svg{
+        width:16px;
+        height:16px;
+        vertical-align:middle;
+        fill:currentColor; }
+    .iui-radio-wrapper.iui-disabled{
+      cursor:not-allowed;
+      color:var(--iui-text-color-muted); }
+      .iui-radio-wrapper.iui-disabled svg{
+        fill:var(--iui-icons-color-actionable-disabled); }
+    .iui-radio-wrapper.iui-positive{
+      color:#53A21A;
+      color:var(--iui-color-foreground-positive); }
+    .iui-radio-wrapper.iui-warning{
+      color:#F18B12;
+      color:var(--iui-color-foreground-warning); }
+    .iui-radio-wrapper.iui-negative{
+      color:#D30A0A;
+      color:var(--iui-color-foreground-negative); }
+  .iui-radio::before{
+    content:'';
+    position:absolute;
+    inset:0;
+    transition:border-color 0.2s ease-out;
+    border-radius:inherit;
+    border-style:solid;
+    border-width:1px;
+    border-color:var(--_iui-checkbox-border-color); }
+  .iui-radio::after{
+    content:'';
+    position:absolute;
+    inset:0;
+    background-color:var(--_iui-checkbox-svg-color);
+    -webkit-mask:var(--_iui-checkbox-mask-image) no-repeat center;
+            mask:var(--_iui-checkbox-mask-image) no-repeat center; }
+  .iui-radio:not(:checked){
+    --_iui-checkbox-mask-image:var(--_iui-checkbox-unchecked-svg); }
+  .iui-radio:checked{
+    --_iui-checkbox-border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-3));
+    --_iui-checkbox-mask-image:var(--_iui-checkbox-checkmark-svg); }
+  .iui-radio:indeterminate{
+    --_iui-checkbox-border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-3));
+    --_iui-checkbox-mask-image:var(--_iui-checkbox-indeterminate-svg); }
+  .iui-radio:hover{
+    --_iui-checkbox-border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2)); }
+  .iui-radio:focus-visible{
     outline:2px solid var(--iui-color-foreground-primary);
     outline-offset:-1px; }
-  .iui-radio input:enabled:focus:not(:focus-visible) ~ .iui-checkbox-checkmark,
-  .iui-radio input:enabled:focus:not(:focus-visible) ~ .iui-radio-dot{
-    outline:none; }
-  .iui-radio input:disabled ~ .iui-checkbox-checkmark,
-  .iui-radio input:disabled ~ .iui-radio-dot{
-    cursor:not-allowed;
-    background-color:#EEF0F3;
-    border-color:#EEF0F3;
-    background-color:var(--iui-color-background-disabled);
-    border-color:var(--iui-color-background-disabled); }
-  .iui-radio input:disabled ~ .iui-checkbox-checkmark svg,
-  .iui-radio input:disabled ~ .iui-radio-dot svg{
-    fill:rgba(0, 0, 0, 0.2);
-    fill:var(--iui-icons-color-actionable-disabled); }
-  .iui-radio input:disabled ~ .iui-label{
-    cursor:not-allowed;
-    color:rgba(0, 0, 0, 0.4);
-    color:var(--iui-text-color-muted); }
-    .iui-radio input:disabled ~ .iui-label svg{
-      fill:rgba(0, 0, 0, 0.2);
-      fill:var(--iui-icons-color-actionable-disabled); }
-  .iui-radio.iui-positive{
-    color:#53A21A;
-    color:var(--iui-color-foreground-positive); }
-  .iui-radio.iui-warning{
-    color:#F18B12;
-    color:var(--iui-color-foreground-warning); }
-  .iui-radio.iui-negative{
-    color:#D30A0A;
-    color:var(--iui-color-foreground-negative); }
-  .iui-radio .iui-radio-dot{
-    border-radius:50%; }
+  @supports not selector(*:focus-visible){
+    .iui-radio:focus{
+      outline:2px solid var(--iui-color-foreground-primary);
+      outline-offset:-1px; } }
+  .iui-radio.iui-checkbox-visibility{
+    --_iui-checkbox-checkmark-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m8 2.99051a8.81883 8.81883 0 0 0 -8 4.95062 8.74664 8.74664 0 0 0 8 5.06836 8.63266 8.63266 0 0 0 8-5.06836 8.83631 8.83631 0 0 0 -8-4.95062zm-1.31445 1.86981a1.47663 1.47663 0 1 1 -1.47663 1.47668 1.47665 1.47665 0 0 1 1.47663-1.47668zm1.31445 6.64917a7.17486 7.17486 0 0 1 -6.30475-3.55237 7.4952 7.4952 0 0 1 2.81475-2.6336 3.83956 3.83956 0 1 0 6.98126.00244 7.522 7.522 0 0 1 2.81774 2.63916 7.09785 7.09785 0 0 1 -6.309 3.54437z" /></svg>');
+    --_iui-checkbox-indeterminate-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m8 3v7.9a4.01179 4.01179 0 0 0 4-4 6.7509 6.7509 0 0 0 -.2-1.4l.1.1a6.89429 6.89429 0 0 1 2.4 2.4 8.39088 8.39088 0 0 1 -2.3 2.3 6.89412 6.89412 0 0 1 -3.9 1.2c-.03345 0-.06653-.00677-.1-.0072v1.5072a8.90686 8.90686 0 0 0 8-5 8.90686 8.90686 0 0 0 -8-5z" opacity=".33" /><path d="m8 0a1 1 0 0 0 -1 1v2.07135a8.91637 8.91637 0 0 0 -7 4.92865 8.91637 8.91637 0 0 0 7 4.92865v2.07135a1 1 0 0 0 2 0v-14a1 1 0 0 0 -1-1zm-1.5 4.9a1.55426 1.55426 0 0 1 .5.087v2.81451a1.40746 1.40746 0 0 1 -.5.09849 1.538 1.538 0 0 1 -1.5-1.5 1.53794 1.53794 0 0 1 1.5-1.5zm-2.3 5.4a6.97279 6.97279 0 0 1 -2.5-2.3 6.89429 6.89429 0 0 1 2.4-2.4c.1 0 .1-.1.2-.1a3.194 3.194 0 0 0 -.3 1.4 4.0047 4.0047 0 0 0 3 3.857v.65289a6.37491 6.37491 0 0 1 -2.8-1.10989z" /></svg>');
+    --_iui-checkbox-unchecked-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m1.70671 12.879 11.17218-11.17219 1.4142 1.4142-11.17218 11.17218zm.99329-1.679 1.1-1.1a5.06317 5.06317 0 0 1 -2-2.1 7.48268 7.48268 0 0 1 6.2-3.5 4.86877 4.86877 0 0 1 1.2.1l1.3-1.3a10.07431 10.07431 0 0 0 -2.5-.3 8.84129 8.84129 0 0 0 -8 5 8.42455 8.42455 0 0 0 2.7 3.2zm10.7-6.4-1.1 1.1a7.08625 7.08625 0 0 1 2 2.1 7.50323 7.50323 0 0 1 -6.2 3.5 8.31665 8.31665 0 0 1 -1.3-.2l-1.3 1.3a8.909 8.909 0 0 0 6.4-.5 9.04344 9.04344 0 0 0 4.1-4.1 9.168 9.168 0 0 0 -2.6-3.2z" /></svg>');
+    --_iui-checkbox-border-color:transparent;
+    --_iui-checkbox-background-color:transparent; }
+    .iui-radio.iui-checkbox-visibility:where(:not(:checked):not(:indeterminate)){
+      --_iui-checkbox-svg-color:var(--iui-icons-color-actionable); }
+    .iui-radio.iui-checkbox-visibility:where(:hover){
+      --_iui-checkbox-border-color:transparent;
+      --_iui-checkbox-background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-6)); }
+  .iui-radio:disabled{
+    --_iui-checkbox-svg-color:var(--iui-icons-color-actionable-disabled);
+    --_iui-checkbox-border-color:var(--iui-color-background-disabled);
+    --_iui-checkbox-background-color:var(--iui-color-background-disabled);
+    cursor:not-allowed; }
+  .iui-radio.iui-loading{
+    --_iui-checkbox-border-color:transparent;
+    --_iui-checkbox-background-color:transparent;
+    opacity:0;
+    position:absolute;
+    cursor:wait; }
+  .iui-radio:checked{
+    --_iui-checkbox-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" ><circle cx="8" cy="8" r="4" /></svg>'); }
+  .iui-radio:not(:checked), .iui-radio:indeterminate{
+    --_iui-checkbox-mask-image:var(--_iui-checkbox-unchecked-svg); }
 
 .iui-radio-tile-container{
   display:inline-flex;
@@ -4205,11 +4169,11 @@ html.iui-theme-dark{
         box-shadow:0 0 0 0 rgba(var(--iui-color-foreground-accessory-rgb), 0); } } }
 
 .iui-popover{ }
-  .iui-popover[data-reference-hidden]{
-    visibility:hidden;
-    pointer-events:none; }
   .iui-popover.tippy-box{
     all:revert; }
+    .iui-popover.tippy-box[data-reference-hidden]{
+      visibility:visible;
+      pointer-events:auto; }
   .iui-popover .tippy-content{
     all:revert; }
 
@@ -4578,7 +4542,8 @@ html.iui-theme-dark{
     border-left:none;
     border-right:none;
     overflow:hidden;
-    justify-content:flex-start; }
+    justify-content:flex-start;
+    --_iui-button-active-stripe-inset:0 calc(100% - 2px) 0 0; }
     .iui-side-navigation .iui-sidenav-button:not(.iui-expand){
       height:55px; }
       @supports (padding: max(0px)){
@@ -4598,9 +4563,6 @@ html.iui-theme-dark{
     .iui-side-navigation .iui-sidenav-button.iui-submenu-open .iui-button-icon{
       fill:#008BE1;
       fill:var(--iui-color-foreground-primary); }
-    .iui-side-navigation .iui-sidenav-button.iui-active{
-      box-shadow:inset 2px 0 0 0 #008BE1;
-      box-shadow:inset 2px 0 0 0 var(--iui-icons-color-primary); }
     .iui-side-navigation .iui-sidenav-button[disabled], .iui-side-navigation .iui-sidenav-button:disabled{
       background-color:#F8F9FB;
       background-color:var(--iui-color-background-2); }
@@ -5226,56 +5188,10 @@ html.iui-theme-dark{
 .iui-paginator-pages-group{
   display:inline-flex;
   align-items:center;
-  isolation:isolate;
   margin:0 8px; }
-  .iui-paginator-pages-group > *{
-    display:flex; }
-    .iui-paginator-pages-group > * input, .iui-paginator-pages-group > * button{
-      position:relative;
-      transition-duration:0ms; }
-      .iui-paginator-pages-group > * input:hover, .iui-paginator-pages-group > * button:hover{
-        z-index:1; }
-      .iui-paginator-pages-group > * input:focus, .iui-paginator-pages-group > * button:focus{
-        z-index:2; }
-        .iui-paginator-pages-group > * input:focus:where(:not(:focus-visible):not(:hover)), .iui-paginator-pages-group > * button:focus:where(:not(:focus-visible):not(:hover)){
-          z-index:revert; }
-      .iui-paginator-pages-group > * input:disabled, .iui-paginator-pages-group > * button:disabled{
-        z-index:-1; }
-      .iui-paginator-pages-group > * input:hover, .iui-paginator-pages-group > * input:focus, .iui-paginator-pages-group > * button:hover, .iui-paginator-pages-group > * button:focus{
-        transition-duration:0.2s; }
-      .iui-paginator-pages-group > * input.iui-active::after, .iui-paginator-pages-group > * button.iui-active::after{
-        content:'';
-        position:absolute;
-        height:2px;
-        opacity:1;
-        top:2px;
-        left:2px;
-        width:calc(100% - 4px);
-        background-color:#008BE1;
-        background-color:var(--iui-color-foreground-primary); }
-      .iui-paginator-pages-group > * input.iui-active:disabled::after, .iui-paginator-pages-group > * button.iui-active:disabled::after{
-        background-color:rgba(0, 0, 0, 0.2);
-        background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
-      .iui-paginator-pages-group > * input:not(.iui-borderless), .iui-paginator-pages-group > * button:not(.iui-borderless){
-        border-radius:0; }
-    .iui-paginator-pages-group > *:first-child input, .iui-paginator-pages-group > *:first-child button:not(.iui-borderless){
-      border-top-left-radius:3px;
-      border-bottom-left-radius:3px; }
-    .iui-paginator-pages-group > *:last-child input, .iui-paginator-pages-group > *:last-child button:not(.iui-borderless){
-      border-top-right-radius:3px;
-      border-bottom-right-radius:3px; }
-    .iui-paginator-pages-group > * + *{
-      margin-left:-1px; }
-    .iui-paginator-pages-group > *:not(:first-child) .iui-default:disabled{
-      border-left-color:#DCE0E3;
-      border-left-color:var(--iui-color-background-4); }
-  .iui-paginator-pages-group > * + *{
-    margin-left:0; }
-  .iui-paginator-pages-group button.iui-active::after{
-    top:auto;
-    bottom:2px; }
 
 .iui-paginator-page-button{
+  --_iui-button-active-stripe-inset:initial;
   margin:0;
   padding:0;
   border:none;
@@ -5307,7 +5223,8 @@ html.iui-theme-dark{
   padding:0 8px;
   height:38px;
   gap:8px;
-  width:38px; }
+  width:38px;
+  --_iui-button-active-stripe-inset:calc(100% - 4px) 2px 2px; }
   @media (prefers-reduced-motion: no-preference){
     .iui-paginator-page-button{
       transition:color 0.2s ease-out, background-color 0.2s ease-out, border-color 0.2s ease-out; } }
@@ -5330,6 +5247,13 @@ html.iui-theme-dark{
     background:var(--iui-color-background-disabled);
     border-color:var(--iui-color-background-disabled);
     color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
+  .iui-paginator-page-button.iui-active::after{
+    content:'';
+    position:absolute;
+    inset:var(--_iui-button-active-stripe-inset);
+    background-color:var(--iui-color-foreground-primary); }
+  .iui-paginator-page-button.iui-active[disabled]::after, .iui-paginator-page-button.iui-active:disabled::after{
+    background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
   .iui-paginator-page-button > .iui-button-icon:only-child{
     margin-left:3px;
     margin-right:3px; }
@@ -5865,10 +5789,26 @@ a.iui-tag{
   color:rgba(0, 0, 0, 0.8);
   background-color:var(--iui-color-background-1);
   color:var(--iui-text-color); }
+  .iui-tile:focus-visible{
+    outline:2px solid var(--iui-color-foreground-primary);
+    outline-offset:2px; }
+  @supports not selector(*:focus-visible){
+    .iui-tile:focus{
+      outline:2px solid var(--iui-color-foreground-primary);
+      outline-offset:2px; } }
+  .iui-tile:hover .iui-tile-more-options, .iui-tile:focus-within .iui-tile-more-options{
+    -webkit-clip-path:revert;
+            clip-path:revert;
+    overflow:visible;
+    position:static;
+    white-space:normal;
+    height:auto;
+    width:auto;
+    padding:0;
+    margin:0;
+    position:absolute; }
   .iui-tile:hover .iui-tile-metadata:not(:last-child), .iui-tile:focus-within .iui-tile-metadata:not(:last-child){
     width:calc(100% - 32px); }
-  .iui-tile:hover .iui-tile-more-options, .iui-tile:focus-within .iui-tile-more-options{
-    visibility:visible; }
   .iui-tile:hover .iui-tile-thumbnail-picture, .iui-tile:focus-within .iui-tile-thumbnail-picture{
     transform:translateZ(0) scale(1.1); }
   .iui-tile.iui-new .iui-tile-name,
@@ -5879,6 +5819,13 @@ a.iui-tag{
     background:linear-gradient(rgba(0, 139, 225, 0.1), rgba(0, 139, 225, 0.1)), linear-gradient(#FFF, #FFF);
     outline:solid 2px var(--iui-color-foreground-primary);
     background:linear-gradient(rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-6)), rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-6))), linear-gradient(var(--iui-color-background-1), var(--iui-color-background-1)); }
+    .iui-tile.iui-selected:focus-visible{
+      outline:4px solid var(--iui-color-foreground-primary);
+      outline-offset:0; }
+    @supports not selector(*:focus-visible){
+      .iui-tile.iui-selected:focus{
+        outline:4px solid var(--iui-color-foreground-primary);
+        outline-offset:0; } }
     .iui-tile.iui-selected .iui-tile-thumbnail-picture{
       transform:translateZ(0) scale(1.1); }
   .iui-tile.iui-folder{
@@ -6090,11 +6037,9 @@ a.iui-tag{
     @supports ((-webkit-backdrop-filter: blur(5px)) or (backdrop-filter: blur(5px))){
       .iui-tile-thumbnail-picture ~ .iui-tile-thumbnail-type-indicator,
       .iui-tile-thumbnail-picture ~ .iui-tile-thumbnail-quick-action{
-        background-color:rgba(0, 0, 0, 0.2);
-        -webkit-backdrop-filter:blur(5px);
-                backdrop-filter:blur(5px);
         background-color:rgba(0, 0, 0, var(--iui-opacity-5));
-        backdrop-filter:blur(5px); } }
+        -webkit-backdrop-filter:blur(5px);
+                backdrop-filter:blur(5px); } }
     .iui-tile-thumbnail-picture ~ .iui-tile-thumbnail-type-indicator > .iui-button-icon,
     .iui-tile-thumbnail-picture ~ .iui-tile-thumbnail-quick-action > .iui-button-icon{
       fill:#FFF;
@@ -6215,16 +6160,22 @@ a.iui-tag{
       white-space:nowrap;
       overflow:hidden;
       text-overflow:ellipsis; }
-  .iui-tile-content .iui-tile-more-options{
-    padding:0 2px;
-    height:27px;
-    gap:4px;
+
+.iui-tile-more-options{
+  position:absolute;
+  bottom:5.5px;
+  right:8px; }
+  .iui-tile-more-options:not(.iui-visible){
+    -webkit-clip-path:inset(50%);
+            clip-path:inset(50%);
+    overflow:hidden;
     position:absolute;
-    bottom:5.5px;
-    right:8px;
-    visibility:hidden; }
-    .iui-tile-content .iui-tile-more-options.iui-visible{
-      visibility:visible; }
+    white-space:nowrap;
+    height:1px;
+    width:1px;
+    padding:0;
+    margin:-1px;
+    border-width:0; }
 
 .iui-time-picker{
   margin:0;
@@ -6730,10 +6681,30 @@ a.iui-tag{
   vertical-align:baseline;
   list-style:none; }
 
+.iui-tree-item:focus-visible{
+  outline:none; }
+  .iui-tree-item:focus-visible > .iui-tree-node{
+    outline:1px solid var(--iui-color-foreground-primary);
+    outline-offset:-1px; }
+    .iui-tree-item:focus-visible > .iui-tree-node.iui-active{
+      outline:2px solid var(--iui-color-foreground-primary);
+      outline-offset:-2px; }
+
+@supports not selector(*:focus-visible){
+  .iui-tree-item:focus{
+    outline:none; }
+    .iui-tree-item:focus > .iui-tree-node{
+      outline:1px solid var(--iui-color-foreground-primary);
+      outline-offset:-1px; }
+      .iui-tree-item:focus > .iui-tree-node.iui-active{
+        outline:2px solid var(--iui-color-foreground-primary);
+        outline-offset:-2px; } }
+
 .iui-tree-node{
   display:flex;
   cursor:pointer;
-  padding:0 8px; }
+  padding:0 8px;
+  align-items:center; }
   .iui-tree-node-checkbox{
     margin-right:8px; }
   .iui-tree-node-content{
@@ -6786,13 +6757,6 @@ a.iui-tag{
       font-size:12px;
       color:rgba(0, 0, 0, 0.4);
       color:var(--iui-text-color-muted); }
-  .iui-tree-node:focus-visible{
-    outline:1px solid var(--iui-color-foreground-primary);
-    outline-offset:-1px; }
-  @supports not selector(*:focus-visible){
-    .iui-tree-node:focus{
-      outline:1px solid var(--iui-color-foreground-primary);
-      outline-offset:-1px; } }
   .iui-tree-node:hover{
     background-color:rgba(0, 139, 225, 0.1);
     background-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-6)); }
@@ -6807,13 +6771,6 @@ a.iui-tag{
     background-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-5));
     outline:thin solid var(--iui-color-foreground-primary);
     outline-offset:-1px; }
-    .iui-tree-node.iui-active:focus-visible{
-      outline:2px solid var(--iui-color-foreground-primary);
-      outline-offset:-2px; }
-    @supports not selector(*:focus-visible){
-      .iui-tree-node.iui-active:focus{
-        outline:2px solid var(--iui-color-foreground-primary);
-        outline-offset:-2px; } }
   .iui-tree-node.iui-disabled{
     cursor:not-allowed;
     outline:none;
@@ -7164,3 +7121,51 @@ a.iui-tag{
           user-select:all;
   color:#53A21A;
   color:var(--iui-color-foreground-positive); }
+
+.iui-skip-to-content-link{
+  background-color:rgba(0, 0, 0, 0.8);
+  background-color:rgba(0, 0, 0, var(--iui-opacity-2));
+  color:#FFF;
+  color:var(--iui-color-foreground-accessory);
+  border-radius:9999px;
+  text-decoration:none;
+  -webkit-user-select:none;
+     -moz-user-select:none;
+      -ms-user-select:none;
+          user-select:none;
+  padding:8.25px 16px;
+  position:fixed;
+  text-align:center;
+  left:50%;
+  top:22px;
+  transform:translateX(-50%) translateY(-170%);
+  transition:background-color 0.2s ease-in-out; }
+  @supports ((-webkit-backdrop-filter: blur(5px)) or (backdrop-filter: blur(5px))){
+    .iui-skip-to-content-link{
+      background-color:rgba(0, 0, 0, var(--iui-opacity-3));
+      -webkit-backdrop-filter:blur(5px);
+              backdrop-filter:blur(5px); } }
+  .iui-skip-to-content-link:focus-visible{
+    outline:2px solid var(--iui-color-foreground-primary);
+    outline-offset:2px; }
+  @supports not selector(*:focus-visible){
+    .iui-skip-to-content-link:focus{
+      outline:2px solid var(--iui-color-foreground-primary);
+      outline-offset:2px; } }
+  @media (prefers-reduced-motion: no-preference){
+    .iui-skip-to-content-link{
+      transition:background-color 0.2s ease-in-out, transform 0.8s ease-in-out, box-shadow 0.2s ease-in-out; } }
+  .iui-skip-to-content-link:hover{
+    background-color:black;
+    background-color:rgba(0, 0, 0, var(--iui-opacity-1)); }
+    @supports ((-webkit-backdrop-filter: blur(5px)) or (backdrop-filter: blur(5px))){
+      .iui-skip-to-content-link:hover{
+        background-color:rgba(0, 0, 0, var(--iui-opacity-2));
+        -webkit-backdrop-filter:blur(5px);
+                backdrop-filter:blur(5px); } }
+  .iui-skip-to-content-link:focus{
+    transform:translateX(-50%) translateY(0);
+    box-shadow:0 6px 30px rgba(0, 0, 0, 0.25); }
+    @media (prefers-reduced-motion: no-preference){
+      .iui-skip-to-content-link:focus{
+        transition:transform 0.2s ease-in-out; } }