mesurer 0.0.9 → 0.0.11

package/dist/styles.css

@@ -7,19 +7,26 @@
       "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
     --msr-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
       "Courier New", monospace;
+    --msr-color-red-50: oklch(97.1% 0.013 17.38);
+    --msr-color-red-200: oklch(88.5% 0.062 18.334);
+    --msr-color-red-600: oklch(57.7% 0.245 27.325);
     --msr-color-black: #000;
     --msr-color-white: #fff;
     --msr-spacing: 0.25rem;
+    --msr-font-weight-normal: 400;
+    --msr-font-weight-medium: 500;
+    --msr-font-weight-semibold: 600;
     --msr-radius-md: 0.375rem;
     --msr-radius-lg: 0.5rem;
     --msr-default-transition-duration: 150ms;
     --msr-default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
     --msr-default-font-family: var(--msr-font-sans);
     --msr-default-mono-font-family: var(--msr-font-mono);
-    --msr-color-ink-50: var(--color-ink-50);
-    --msr-color-ink-200: var(--color-ink-200);
-    --msr-color-ink-700: var(--color-ink-700);
-    --msr-color-ink-900: var(--color-ink-900);
+    --msr-color-ink-50: #f8fafc;
+    --msr-color-ink-200: #e2e8f0;
+    --msr-color-ink-500: #64748b;
+    --msr-color-ink-700: #334155;
+    --msr-color-ink-900: #0f172a;
   }
 }
 @layer base {
@@ -198,9 +205,15 @@
   .msr\:top-full {
     top: 100%;
   }
+  .msr\:-right-1 {
+    right: calc(var(--msr-spacing) * -1);
+  }
   .msr\:right-0 {
     right: calc(var(--msr-spacing) * 0);
   }
+  .msr\:right-\[8px\] {
+    right: 8px;
+  }
   .msr\:bottom-0 {
     bottom: calc(var(--msr-spacing) * 0);
   }
@@ -213,74 +226,147 @@
   .msr\:left-1\/2 {
     left: calc(1 / 2 * 100%);
   }
+  .msr\:left-\[8px\] {
+    left: 8px;
+  }
   .msr\:left-\[18px\] {
     left: 18px;
   }
+  .msr\:z-10 {
+    z-index: 10;
+  }
   .msr\:z-50 {
     z-index: 50;
   }
   .msr\:z-\[70\] {
     z-index: 70;
   }
+  .msr\:z-\[80\] {
+    z-index: 80;
+  }
   .msr\:z-\[90\] {
     z-index: 90;
   }
+  .msr\:col-span-2 {
+    grid-column: span 2 / span 2;
+  }
   .msr\:mt-2 {
     margin-top: calc(var(--msr-spacing) * 2);
   }
+  .msr\:mb-1 {
+    margin-bottom: calc(var(--msr-spacing) * 1);
+  }
   .msr\:mb-2 {
     margin-bottom: calc(var(--msr-spacing) * 2);
   }
   .msr\:-ml-1 {
     margin-left: calc(var(--msr-spacing) * -1);
   }
+  .msr\:ml-1 {
+    margin-left: calc(var(--msr-spacing) * 1);
+  }
+  .msr\:box-border {
+    box-sizing: border-box;
+  }
   .msr\:block {
     display: block;
   }
   .msr\:flex {
     display: flex;
   }
+  .msr\:grid {
+    display: grid;
+  }
+  .msr\:inline-flex {
+    display: inline-flex;
+  }
+  .msr\:size-3 {
+    width: calc(var(--msr-spacing) * 3);
+    height: calc(var(--msr-spacing) * 3);
+  }
+  .msr\:size-4 {
+    width: calc(var(--msr-spacing) * 4);
+    height: calc(var(--msr-spacing) * 4);
+  }
   .msr\:size-8 {
     width: calc(var(--msr-spacing) * 8);
     height: calc(var(--msr-spacing) * 8);
   }
+  .msr\:size-\[10px\] {
+    width: 10px;
+    height: 10px;
+  }
   .msr\:size-\[18px\] {
     width: 18px;
     height: 18px;
   }
+  .msr\:size-full {
+    width: 100%;
+    height: 100%;
+  }
   .msr\:h-6 {
     height: calc(var(--msr-spacing) * 6);
   }
   .msr\:h-8 {
     height: calc(var(--msr-spacing) * 8);
   }
+  .msr\:h-\[14px\] {
+    height: 14px;
+  }
   .msr\:h-full {
     height: 100%;
   }
   .msr\:h-px {
     height: 1px;
   }
+  .msr\:max-h-\[min\(70vh\,34rem\)\] {
+    max-height: min(70vh, 34rem);
+  }
   .msr\:w-4 {
     width: calc(var(--msr-spacing) * 4);
   }
   .msr\:w-6 {
     width: calc(var(--msr-spacing) * 6);
   }
+  .msr\:w-9 {
+    width: calc(var(--msr-spacing) * 9);
+  }
+  .msr\:w-12 {
+    width: calc(var(--msr-spacing) * 12);
+  }
   .msr\:w-44 {
     width: calc(var(--msr-spacing) * 44);
   }
   .msr\:w-\[18px\] {
     width: 18px;
   }
+  .msr\:w-\[26px\] {
+    width: 26px;
+  }
+  .msr\:w-\[272px\] {
+    width: 272px;
+  }
   .msr\:w-full {
     width: 100%;
   }
   .msr\:w-px {
     width: 1px;
   }
+  .msr\:max-w-\[calc\(100vw-16px\)\] {
+    max-width: calc(100vw - 16px);
+  }
+  .msr\:min-w-0 {
+    min-width: calc(var(--msr-spacing) * 0);
+  }
+  .msr\:min-w-36 {
+    min-width: calc(var(--msr-spacing) * 36);
+  }
   .msr\:flex-1 {
     flex: 1;
   }
+  .msr\:shrink-0 {
+    flex-shrink: 0;
+  }
   .msr\:-translate-x-1\/2 {
     --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
     translate: var(--tw-translate-x) var(--tw-translate-y);
@@ -304,33 +390,81 @@
   .msr\:cursor-default {
     cursor: default;
   }
+  .msr\:cursor-pointer {
+    cursor: pointer;
+  }
+  .msr\:touch-none {
+    touch-action: none;
+  }
+  .msr\:appearance-none {
+    appearance: none;
+  }
+  .msr\:grid-cols-\[78px_156px\] {
+    grid-template-columns: 78px 156px;
+  }
   .msr\:flex-col {
     flex-direction: column;
   }
   .msr\:items-center {
     align-items: center;
   }
+  .msr\:items-start {
+    align-items: flex-start;
+  }
   .msr\:items-stretch {
     align-items: stretch;
   }
+  .msr\:justify-between {
+    justify-content: space-between;
+  }
   .msr\:justify-center {
     justify-content: center;
   }
+  .msr\:justify-end {
+    justify-content: flex-end;
+  }
+  .msr\:gap-0 {
+    gap: calc(var(--msr-spacing) * 0);
+  }
   .msr\:gap-1 {
     gap: calc(var(--msr-spacing) * 1);
   }
+  .msr\:gap-1\.5 {
+    gap: calc(var(--msr-spacing) * 1.5);
+  }
   .msr\:gap-2 {
     gap: calc(var(--msr-spacing) * 2);
   }
+  .msr\:gap-3 {
+    gap: calc(var(--msr-spacing) * 3);
+  }
   .msr\:gap-px {
     gap: 1px;
   }
+  .msr\:gap-x-3 {
+    column-gap: calc(var(--msr-spacing) * 3);
+  }
+  .msr\:gap-y-1 {
+    row-gap: calc(var(--msr-spacing) * 1);
+  }
+  .msr\:justify-self-end {
+    justify-self: flex-end;
+  }
   .msr\:overflow-hidden {
     overflow: hidden;
   }
+  .msr\:overflow-y-auto {
+    overflow-y: auto;
+  }
   .msr\:rounded {
     border-radius: 0.25rem;
   }
+  .msr\:rounded-\[3px\] {
+    border-radius: 3px;
+  }
+  .msr\:rounded-\[5px\] {
+    border-radius: 5px;
+  }
   .msr\:rounded-\[6px\] {
     border-radius: 6px;
   }
@@ -340,6 +474,9 @@
   .msr\:rounded-\[12px\] {
     border-radius: 12px;
   }
+  .msr\:rounded-full {
+    border-radius: calc(infinity * 1px);
+  }
   .msr\:rounded-lg {
     border-radius: var(--msr-radius-lg);
   }
@@ -350,10 +487,22 @@
     border-style: var(--tw-border-style);
     border-width: 1px;
   }
+  .msr\:border-0 {
+    border-style: var(--tw-border-style);
+    border-width: 0px;
+  }
   .msr\:border-t {
     border-top-style: var(--tw-border-style);
     border-top-width: 1px;
   }
+  .msr\:border-t-2 {
+    border-top-style: var(--tw-border-style);
+    border-top-width: 2px;
+  }
+  .msr\:border-b {
+    border-bottom-style: var(--tw-border-style);
+    border-bottom-width: 1px;
+  }
   .msr\:border-l {
     border-left-style: var(--tw-border-style);
     border-left-width: 1px;
@@ -362,15 +511,56 @@
     --tw-border-style: dashed;
     border-style: dashed;
   }
+  .msr\:border-dotted {
+    --tw-border-style: dotted;
+    border-style: dotted;
+  }
+  .msr\:border-solid {
+    --tw-border-style: solid;
+    border-style: solid;
+  }
+  .msr\:border-\[\#0d99ff\] {
+    border-color: #0d99ff;
+  }
   .msr\:border-\[\#2563eb\]\/70 {
     border-color: color-mix(in oklab, #2563eb 70%, transparent);
   }
+  .msr\:border-black\/8 {
+    border-color: var(--msr-color-black);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--msr-color-black) 8%, transparent);
+    }
+  }
+  .msr\:border-black\/10 {
+    border-color: var(--msr-color-black);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--msr-color-black) 10%, transparent);
+    }
+  }
+  .msr\:border-black\/15 {
+    border-color: var(--msr-color-black);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--msr-color-black) 15%, transparent);
+    }
+  }
   .msr\:border-ink-200 {
     border-color: var(--msr-color-ink-200);
   }
+  .msr\:border-ink-700 {
+    border-color: var(--msr-color-ink-700);
+  }
+  .msr\:border-red-200 {
+    border-color: var(--msr-color-red-200);
+  }
+  .msr\:border-transparent {
+    border-color: transparent;
+  }
   .msr\:bg-\[\#0d99ff\] {
     background-color: #0d99ff;
   }
+  .msr\:bg-\[\#0d99ff\]\/10 {
+    background-color: color-mix(in oklab, #0d99ff 10%, transparent);
+  }
   .msr\:bg-\[\#2563eb\] {
     background-color: #2563eb;
   }
@@ -386,6 +576,9 @@
       background-color: color-mix(in oklab, var(--msr-color-black) 10%, transparent);
     }
   }
+  .msr\:bg-ink-50 {
+    background-color: var(--msr-color-ink-50);
+  }
   .msr\:bg-ink-900\/90 {
     background-color: var(--msr-color-ink-900);
     @supports (color: color-mix(in lab, red, red)) {
@@ -401,12 +594,24 @@
   .msr\:p-1 {
     padding: calc(var(--msr-spacing) * 1);
   }
+  .msr\:p-3 {
+    padding: calc(var(--msr-spacing) * 3);
+  }
+  .msr\:p-px {
+    padding: 1px;
+  }
   .msr\:px-1 {
     padding-inline: calc(var(--msr-spacing) * 1);
   }
+  .msr\:px-1\.5 {
+    padding-inline: calc(var(--msr-spacing) * 1.5);
+  }
   .msr\:px-2 {
     padding-inline: calc(var(--msr-spacing) * 2);
   }
+  .msr\:py-0 {
+    padding-block: calc(var(--msr-spacing) * 0);
+  }
   .msr\:py-0\.5 {
     padding-block: calc(var(--msr-spacing) * 0.5);
   }
@@ -416,9 +621,21 @@
   .msr\:py-1\.5 {
     padding-block: calc(var(--msr-spacing) * 1.5);
   }
+  .msr\:py-2 {
+    padding-block: calc(var(--msr-spacing) * 2);
+  }
+  .msr\:pb-1 {
+    padding-bottom: calc(var(--msr-spacing) * 1);
+  }
+  .msr\:text-center {
+    text-align: center;
+  }
   .msr\:text-left {
     text-align: left;
   }
+  .msr\:font-mono {
+    font-family: var(--msr-font-mono);
+  }
   .msr\:text-\[9px\] {
     font-size: 9px;
   }
@@ -431,6 +648,18 @@
   .msr\:text-\[12px\] {
     font-size: 12px;
   }
+  .msr\:leading-4 {
+    --tw-leading: calc(var(--msr-spacing) * 4);
+    line-height: calc(var(--msr-spacing) * 4);
+  }
+  .msr\:leading-none {
+    --tw-leading: 1;
+    line-height: 1;
+  }
+  .msr\:font-medium {
+    --tw-font-weight: var(--msr-font-weight-medium);
+    font-weight: var(--msr-font-weight-medium);
+  }
   .msr\:whitespace-nowrap {
     white-space: nowrap;
   }
@@ -440,12 +669,33 @@
   .msr\:text-black {
     color: var(--msr-color-black);
   }
+  .msr\:text-black\/45 {
+    color: var(--msr-color-black);
+    @supports (color: color-mix(in lab, red, red)) {
+      color: color-mix(in oklab, var(--msr-color-black) 45%, transparent);
+    }
+  }
+  .msr\:text-black\/60 {
+    color: var(--msr-color-black);
+    @supports (color: color-mix(in lab, red, red)) {
+      color: color-mix(in oklab, var(--msr-color-black) 60%, transparent);
+    }
+  }
   .msr\:text-ink-50 {
     color: var(--msr-color-ink-50);
   }
+  .msr\:text-ink-500 {
+    color: var(--msr-color-ink-500);
+  }
   .msr\:text-ink-700 {
     color: var(--msr-color-ink-700);
   }
+  .msr\:text-ink-900 {
+    color: var(--msr-color-ink-900);
+  }
+  .msr\:text-red-600 {
+    color: var(--msr-color-red-600);
+  }
   .msr\:text-white {
     color: var(--msr-color-white);
   }
@@ -465,6 +715,18 @@
   .msr\:opacity-100 {
     opacity: 100%;
   }
+  .msr\:shadow-\[0_0_0_1px_rgba\(15\,23\,42\,0\.12\)\] {
+    --tw-shadow: 0 0 0 1px var(--tw-shadow-color, rgba(15,23,42,0.12));
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+  }
+  .msr\:shadow-lg {
+    --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+  }
+  .msr\:shadow-sm {
+    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+  }
   .msr\:outline {
     outline-style: var(--tw-outline-style);
     outline-width: 1px;
@@ -472,11 +734,26 @@
   .msr\:outline-transparent {
     outline-color: transparent;
   }
+  .msr\:transition-colors {
+    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
+    transition-timing-function: var(--tw-ease, var(--msr-default-transition-timing-function));
+    transition-duration: var(--tw-duration, var(--msr-default-transition-duration));
+  }
   .msr\:transition-opacity {
     transition-property: opacity;
     transition-timing-function: var(--tw-ease, var(--msr-default-transition-timing-function));
     transition-duration: var(--tw-duration, var(--msr-default-transition-duration));
   }
+  .msr\:transition-shadow {
+    transition-property: box-shadow;
+    transition-timing-function: var(--tw-ease, var(--msr-default-transition-timing-function));
+    transition-duration: var(--tw-duration, var(--msr-default-transition-duration));
+  }
+  .msr\:transition-transform {
+    transition-property: transform, translate, scale, rotate;
+    transition-timing-function: var(--tw-ease, var(--msr-default-transition-timing-function));
+    transition-duration: var(--tw-duration, var(--msr-default-transition-duration));
+  }
   .msr\:transition-none {
     transition-property: none;
   }
@@ -492,6 +769,54 @@
     -webkit-user-select: none;
     user-select: none;
   }
+  .msr\:group-hover\:border-ink-200 {
+    &:is(:where(.msr\:group):hover *) {
+      @media (hover: hover) {
+        border-color: var(--msr-color-ink-200);
+      }
+    }
+  }
+  .msr\:focus-within\:rounded-l-\[5px\] {
+    &:focus-within {
+      border-top-left-radius: 5px;
+      border-bottom-left-radius: 5px;
+    }
+  }
+  .msr\:focus-within\:rounded-r-\[5px\] {
+    &:focus-within {
+      border-top-right-radius: 5px;
+      border-bottom-right-radius: 5px;
+    }
+  }
+  .msr\:focus-within\:outline {
+    &:focus-within {
+      outline-style: var(--tw-outline-style);
+      outline-width: 1px;
+    }
+  }
+  .msr\:focus-within\:outline-1 {
+    &:focus-within {
+      outline-style: var(--tw-outline-style);
+      outline-width: 1px;
+    }
+  }
+  .msr\:focus-within\:outline-offset-\[-1px\] {
+    &:focus-within {
+      outline-offset: -1px;
+    }
+  }
+  .msr\:focus-within\:outline-\[\#0d99ff\] {
+    &:focus-within {
+      outline-color: #0d99ff;
+    }
+  }
+  .msr\:hover\:border-ink-200 {
+    &:hover {
+      @media (hover: hover) {
+        border-color: var(--msr-color-ink-200);
+      }
+    }
+  }
   .msr\:hover\:bg-\[\#0d99ff\] {
     &:hover {
       @media (hover: hover) {
@@ -519,6 +844,34 @@
       }
     }
   }
+  .msr\:hover\:bg-ink-50 {
+    &:hover {
+      @media (hover: hover) {
+        background-color: var(--msr-color-ink-50);
+      }
+    }
+  }
+  .msr\:hover\:bg-red-50 {
+    &:hover {
+      @media (hover: hover) {
+        background-color: var(--msr-color-red-50);
+      }
+    }
+  }
+  .msr\:hover\:text-black {
+    &:hover {
+      @media (hover: hover) {
+        color: var(--msr-color-black);
+      }
+    }
+  }
+  .msr\:hover\:text-ink-700 {
+    &:hover {
+      @media (hover: hover) {
+        color: var(--msr-color-ink-700);
+      }
+    }
+  }
   .msr\:hover\:text-white {
     &:hover {
       @media (hover: hover) {
@@ -526,12 +879,54 @@
       }
     }
   }
+  .msr\:hover\:underline {
+    &:hover {
+      @media (hover: hover) {
+        text-decoration-line: underline;
+      }
+    }
+  }
+  .msr\:focus\:shadow-\[inset_0_0_0_1px_\#0d99ff\] {
+    &:focus {
+      --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, #0d99ff);
+      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    }
+  }
   .msr\:focus\:outline-none {
     &:focus {
       --tw-outline-style: none;
       outline-style: none;
     }
   }
+  .msr\:focus-visible\:shadow-\[inset_0_0_0_1px_\#0d99ff\] {
+    &:focus-visible {
+      --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, #0d99ff);
+      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    }
+  }
+  .msr\:focus-visible\:shadow-\[inset_0_0_0_1px_\#ef4444\] {
+    &:focus-visible {
+      --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, #ef4444);
+      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    }
+  }
+  .msr\:focus-visible\:ring-1 {
+    &:focus-visible {
+      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
+      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    }
+  }
+  .msr\:focus-visible\:ring-\[\#0d99ff\]\/25 {
+    &:focus-visible {
+      --tw-ring-color: color-mix(in oklab, #0d99ff 25%, transparent);
+    }
+  }
+  .msr\:focus-visible\:outline-none {
+    &:focus-visible {
+      --tw-outline-style: none;
+      outline-style: none;
+    }
+  }
 }
 :root, :host {
   --color-ink-50: #f8fafc;
@@ -540,12 +935,77 @@
   --color-ink-700: #334155;
   --color-ink-900: #0f172a;
 }
+:host {
+  all: initial;
+  display: block;
+  color-scheme: light;
+  color: #0f172a;
+  font-family: ui-sans-serif, system-ui, sans-serif;
+  font-size: 16px;
+  font-weight: 400;
+  line-height: 1.5;
+  letter-spacing: normal;
+  direction: ltr;
+  --msr-spacing: 4px;
+}
+*, *::before, *::after {
+  box-sizing: border-box;
+}
+@layer base {
+  *, ::before, ::after, ::backdrop {
+    --tw-border-style: solid;
+    --tw-outline-style: solid;
+    --tw-shadow: 0 0 #0000;
+    --tw-inset-shadow: 0 0 #0000;
+    --tw-ring-shadow: 0 0 #0000;
+    --tw-inset-ring-shadow: 0 0 #0000;
+    --tw-ring-offset-shadow: 0 0 #0000;
+    --tw-translate-x: 0;
+    --tw-translate-y: 0;
+    --tw-translate-z: 0;
+  }
+  button, input, select, textarea {
+    appearance: none;
+    background-color: transparent;
+    padding: 0;
+    font: inherit;
+    color: inherit;
+    letter-spacing: inherit;
+  }
+}
 .mesurer-toolbar-surface {
   box-shadow: 0 0 0.5px rgba(0, 0, 0, 0.18), 0 3px 8px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.1);
 }
 .mesurer-menu-surface {
   box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
 }
+.mesurer-color-picker {
+  border: 1px solid rgba(0, 0, 0, 0.1);
+  box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
+}
+.mesurer-settings-tabs {
+  box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.08);
+}
+.mesurer-settings-tab[aria-selected="true"] {
+  box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.12);
+}
+.mesurer-switch-track {
+  box-sizing: border-box;
+  border: 1px solid #e2e8f0;
+}
+.mesurer-switch-track[data-checked="true"] {
+  border-color: #0d99ff;
+}
+.mesurer-control-shell {
+  border: 1px solid transparent;
+}
+.mesurer-control-shell:hover {
+  border-color: #e2e8f0;
+}
+.mesurer-control-focus:focus-within {
+  outline: 1px solid #0d99ff;
+  outline-offset: -1px;
+}
 .mesurer-root {
   --msr-spacing: 4px;
 }
@@ -569,6 +1029,14 @@
   inherits: false;
   initial-value: solid;
 }
+@property --tw-leading {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-font-weight {
+  syntax: "*";
+  inherits: false;
+}
 @property --tw-ordinal {
   syntax: "*";
   inherits: false;
@@ -589,6 +1057,71 @@
   syntax: "*";
   inherits: false;
 }
+@property --tw-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-shadow-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-shadow-alpha {
+  syntax: "<percentage>";
+  inherits: false;
+  initial-value: 100%;
+}
+@property --tw-inset-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-inset-shadow-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-inset-shadow-alpha {
+  syntax: "<percentage>";
+  inherits: false;
+  initial-value: 100%;
+}
+@property --tw-ring-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-ring-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-inset-ring-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-inset-ring-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-ring-inset {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-ring-offset-width {
+  syntax: "<length>";
+  inherits: false;
+  initial-value: 0px;
+}
+@property --tw-ring-offset-color {
+  syntax: "*";
+  inherits: false;
+  initial-value: #fff;
+}
+@property --tw-ring-offset-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
 @property --tw-outline-style {
   syntax: "*";
   inherits: false;
@@ -605,11 +1138,27 @@
       --tw-translate-y: 0;
       --tw-translate-z: 0;
       --tw-border-style: solid;
+      --tw-leading: initial;
+      --tw-font-weight: initial;
       --tw-ordinal: initial;
       --tw-slashed-zero: initial;
       --tw-numeric-figure: initial;
       --tw-numeric-spacing: initial;
       --tw-numeric-fraction: initial;
+      --tw-shadow: 0 0 #0000;
+      --tw-shadow-color: initial;
+      --tw-shadow-alpha: 100%;
+      --tw-inset-shadow: 0 0 #0000;
+      --tw-inset-shadow-color: initial;
+      --tw-inset-shadow-alpha: 100%;
+      --tw-ring-color: initial;
+      --tw-ring-shadow: 0 0 #0000;
+      --tw-inset-ring-color: initial;
+      --tw-inset-ring-shadow: 0 0 #0000;
+      --tw-ring-inset: initial;
+      --tw-ring-offset-width: 0px;
+      --tw-ring-offset-color: #fff;
+      --tw-ring-offset-shadow: 0 0 #0000;
       --tw-outline-style: solid;
       --tw-duration: initial;
     }