@moldable-ai/ui 0.2.26 → 0.2.31

package/src/tokens/macos-27/source/paint-styles.generated.css

@@ -0,0 +1,81 @@
+/*
+ * Generated source data.
+ * Source: macOS 27.
+ * All 10 material paint styles retain their ordered layers and blend modes.
+ */
+[data-ui-platform='macos'][data-ui-platform-version='27'],
+[data-ui-platform='macos'][data-ui-platform-version='27']
+  [data-ui-appearance='light'] {
+  --m27-source-material-standard-blur: 60px;
+  --m27-source-material-corner-smoothing: 0.6;
+
+  --m27-source-material-ultra-thick-layer-count: 2;
+  --m27-source-material-ultra-thick-layer-1-color: #333333;
+  --m27-source-material-ultra-thick-layer-1-opacity: 1;
+  --m27-source-material-ultra-thick-layer-1-blend: linear-dodge;
+  --m27-source-material-ultra-thick-layer-2-color: #ececec;
+  --m27-source-material-ultra-thick-layer-2-opacity: 0.88;
+  --m27-source-material-ultra-thick-layer-2-blend: normal;
+  --m27-source-material-ultra-thick-fill: rgb(236 236 236 / 88%);
+
+  --m27-source-material-thick-layer-count: 1;
+  --m27-source-material-thick-layer-1-color: #f6f6f6;
+  --m27-source-material-thick-layer-1-opacity: 0.72;
+  --m27-source-material-thick-layer-1-blend: normal;
+  --m27-source-material-thick-fill: rgb(246 246 246 / 72%);
+
+  --m27-source-material-medium-layer-count: 1;
+  --m27-source-material-medium-layer-1-color: #f6f6f6;
+  --m27-source-material-medium-layer-1-opacity: 0.6;
+  --m27-source-material-medium-layer-1-blend: normal;
+  --m27-source-material-medium-fill: rgb(246 246 246 / 60%);
+
+  --m27-source-material-thin-layer-count: 1;
+  --m27-source-material-thin-layer-1-color: #f6f6f6;
+  --m27-source-material-thin-layer-1-opacity: 0.48;
+  --m27-source-material-thin-layer-1-blend: normal;
+  --m27-source-material-thin-fill: rgb(246 246 246 / 48%);
+
+  --m27-source-material-ultra-thin-layer-count: 1;
+  --m27-source-material-ultra-thin-layer-1-color: #f6f6f6;
+  --m27-source-material-ultra-thin-layer-1-opacity: 0.36;
+  --m27-source-material-ultra-thin-layer-1-blend: normal;
+  --m27-source-material-ultra-thin-fill: rgb(246 246 246 / 36%);
+}
+
+[data-ui-platform='macos'][data-ui-platform-version='27']
+  [data-ui-appearance='dark'],
+[data-ui-platform='macos'][data-ui-platform-version='27'][data-ui-appearance='dark'] {
+  --m27-source-material-standard-blur: 60px;
+  --m27-source-material-corner-smoothing: 0.6;
+
+  --m27-source-material-ultra-thick-layer-count: 1;
+  --m27-source-material-ultra-thick-layer-1-color: #000000;
+  --m27-source-material-ultra-thick-layer-1-opacity: 0.5;
+  --m27-source-material-ultra-thick-layer-1-blend: normal;
+  --m27-source-material-ultra-thick-fill: rgb(0 0 0 / 50%);
+
+  --m27-source-material-thick-layer-count: 1;
+  --m27-source-material-thick-layer-1-color: #000000;
+  --m27-source-material-thick-layer-1-opacity: 0.4;
+  --m27-source-material-thick-layer-1-blend: normal;
+  --m27-source-material-thick-fill: rgb(0 0 0 / 40%);
+
+  --m27-source-material-medium-layer-count: 1;
+  --m27-source-material-medium-layer-1-color: #000000;
+  --m27-source-material-medium-layer-1-opacity: 0.29;
+  --m27-source-material-medium-layer-1-blend: normal;
+  --m27-source-material-medium-fill: rgb(0 0 0 / 29%);
+
+  --m27-source-material-thin-layer-count: 1;
+  --m27-source-material-thin-layer-1-color: #000000;
+  --m27-source-material-thin-layer-1-opacity: 0.2;
+  --m27-source-material-thin-layer-1-blend: normal;
+  --m27-source-material-thin-fill: rgb(0 0 0 / 20%);
+
+  --m27-source-material-ultra-thin-layer-count: 1;
+  --m27-source-material-ultra-thin-layer-1-color: #000000;
+  --m27-source-material-ultra-thin-layer-1-opacity: 0.1;
+  --m27-source-material-ultra-thin-layer-1-blend: normal;
+  --m27-source-material-ultra-thin-fill: rgb(0 0 0 / 10%);
+}

package/src/tokens/macos-27/source/provenance.generated.json

@@ -0,0 +1,62 @@
+{
+  "source": "macOS 27",
+  "schemaVersion": 1,
+  "scope": {
+    "platform": "macos",
+    "platformVersion": "27",
+    "publicTheme": false,
+    "immutableSourcePack": true
+  },
+  "inventory": {
+    "variables": {
+      "total": 147,
+      "byType": { "COLOR": 68, "FLOAT": 75, "STRING": 4 }
+    },
+    "collections": {
+      "Colors": {
+        "count": 63,
+        "modes": ["Light", "Dark"],
+        "defaultMode": "Light"
+      },
+      "Sizes": {
+        "count": 65,
+        "modes": ["Medium", "Mini", "Small", "Large", "XL"],
+        "defaultMode": "Medium"
+      },
+      "Kit": {
+        "count": 18,
+        "modes": ["Mode 1"],
+        "defaultMode": "Mode 1"
+      },
+      "Context": {
+        "count": 1,
+        "modes": ["Content Area", "Over-glass"],
+        "defaultMode": "Content Area"
+      }
+    },
+    "localStyles": { "paint": 10, "text": 22, "effect": 0, "grid": 0 }
+  },
+  "metadata": {
+    "allVariableScopes": ["ALL_SCOPES"],
+    "allCodeSyntaxObjectsEmpty": true,
+    "hiddenKitVariables": [
+      "Component Fill",
+      "Component Stroke",
+      "Subcomponent Fill",
+      "Subcomponent Stroke",
+      "Section Fill",
+      "Section Stroke",
+      "Link"
+    ]
+  },
+  "knownSourceAnomalies": [
+    "Title 2/Emphasized uses Inter Bold while adjacent styles use SF Pro.",
+    "One dark vibrant tertiary text example uses #414141 with LINEAR_DODGE rather than the #404040 variable.",
+    "Two source swatch components share a name.",
+    "The Kit collection source mode is named Mode 1.",
+    "There are no local effect or grid styles.",
+    "Labels/Seximal is an unusual source name.",
+    "Inactive Small glass Primary and Default are identical within each mode.",
+    "Medium and Large glass have identical visible values, including separate frost variables that both resolve to 16."
+  ]
+}

package/src/tokens/macos-27/source/sizes.generated.css

@@ -0,0 +1,385 @@
+/*
+ * Generated source data.
+ * Source: macOS 27.
+ * Five source modes and all 65 variables are preserved. Aliases remain aliases.
+ */
+[data-ui-platform='macos'][data-ui-platform-version='27'],
+[data-ui-platform='macos'][data-ui-platform-version='27']
+  [data-control-size='medium'] {
+  --m27-source-size-global-font-size: 13px;
+  --m27-source-size-arrow-button-font-size: 13px;
+  --m27-source-size-global-height: 24px;
+  --m27-source-size-global-radius: 6px;
+  --m27-source-size-button-padding-horizontal: 16px;
+  --m27-source-size-checkboxes-width: var(--m27-source-size-radio-button-width);
+  --m27-source-size-button-radius: var(--m27-source-size-global-radius);
+  --m27-source-size-checkboxes-width-checkmark: 9.3100004196167px;
+  --m27-source-size-checkboxes-height-checkmark: 8.930000305175781px;
+  --m27-source-size-color-well-width: 48px;
+  --m27-source-size-color-well-height: 24px;
+  --m27-source-size-checkboxes-radius: 5.5px;
+  --m27-source-size-combo-button-font-size-chevron: 11px;
+  --m27-source-size-combo-button-inset: 2px;
+  --m27-source-size-combo-button-text-inset-right: 28px;
+  --m27-source-size-combo-button-radius-button: 4.5px;
+  --m27-source-size-combo-button-width-button: 24px;
+  --m27-source-size-cursor-height: 18px;
+  --m27-source-size-dial-height-knob: 6px;
+  --m27-source-size-disclosure-font-size: 13px;
+  --m27-source-size-disclosure-radius: 6px;
+  --m27-source-size-dial-inset-knob: 3px;
+  --m27-source-size-fields-inset-left: 8px;
+  --m27-source-size-fields-inset-right: 8px;
+  --m27-source-size-fields-font-size-search-glyph: 13px;
+  --m27-source-size-fields-leading-search-glyph: 15px;
+  --m27-source-size-menu-height: 24px;
+  --m27-source-size-menu-font-size: 13px;
+  --m27-source-size-menu-font-size-symbol: 13px;
+  --m27-source-size-menu-width-symbol: 12px;
+  --m27-source-size-menu-inset-top-header: 5px;
+  --m27-source-size-menu-inset-bottom-header: 4px;
+  --m27-source-size-menu-inset-left-header: 20px;
+  --m27-source-size-popup-font-size-chevron: 11px;
+  --m27-source-size-popup-inset-left: 12px;
+  --m27-source-size-segmented-control-margins: 10px;
+  --m27-source-size-radio-button-height-dash: 2px;
+  --m27-source-size-segmented-control-height-separator: 14px;
+  --m27-source-size-radio-button-spacing: 3px;
+  --m27-source-size-radio-button-width: 16px;
+  --m27-source-size-radio-button-width-dot: 4.800000190734863px;
+  --m27-source-size-radio-button-width-dash: 6.5px;
+  --m27-source-size-slider-knob-non-ticked-inset: 0px;
+  --m27-source-size-slider-knob-non-ticked-width: 20px;
+  --m27-source-size-slider-knob-non-ticked-height: 16px;
+  --m27-source-size-slider-knob-non-ticked-width-clicked: 25px;
+  --m27-source-size-slider-knob-non-ticked-height-clicked: 20px;
+  --m27-source-size-slider-knob-ticked-width: 20px;
+  --m27-source-size-slider-knob-ticked-height: 16px;
+  --m27-source-size-slider-knob-ticked-width-clicked: 25px;
+  --m27-source-size-slider-knob-ticked-height-clicked: 20px;
+  --m27-source-size-slider-track-inset-vertical: 1px;
+  --m27-source-size-slider-track-inset-horizontal: 1px;
+  --m27-source-size-slider-track-tick-spacing: 2px;
+  --m27-source-size-stepper-width: 20px;
+  --m27-source-size-stepper-radius: 6px;
+  --m27-source-size-stepper-font-size: 12px;
+  --m27-source-size-stepper-width-separator: 14px;
+  --m27-source-size-toggle-knob-width: 32px;
+  --m27-source-size-toggle-knob-height: 20px;
+  --m27-source-size-toggle-knob-clicked-width: 50px;
+  --m27-source-size-toggle-knob-clicked-height: 31px;
+  --m27-source-size-toggle-track-width: 54px;
+  --m27-source-size-toggle-track-height: var(--m27-source-size-global-height);
+  --m27-source-size-mode: 'Medium';
+
+  /* Compatibility names used by the semantic alias layer. */
+  --m27-source-size-control-height: var(--m27-source-size-global-height);
+  --m27-source-size-control-radius: var(--m27-source-size-global-radius);
+  --m27-source-size-button-padding-inline: var(
+    --m27-source-size-button-padding-horizontal
+  );
+}
+
+[data-ui-platform='macos'][data-ui-platform-version='27']
+  [data-control-size='mini'],
+[data-ui-platform='macos'][data-ui-platform-version='27'][data-control-size='mini'] {
+  --m27-source-size-global-font-size: 10px;
+  --m27-source-size-arrow-button-font-size: 11px;
+  --m27-source-size-global-height: 16px;
+  --m27-source-size-global-radius: 4px;
+  --m27-source-size-button-padding-horizontal: 7px;
+  --m27-source-size-checkboxes-width: var(--m27-source-size-radio-button-width);
+  --m27-source-size-button-radius: var(--m27-source-size-global-radius);
+  --m27-source-size-checkboxes-width-checkmark: 7.78000020980835px;
+  --m27-source-size-checkboxes-height-checkmark: 7.550000190734863px;
+  --m27-source-size-color-well-width: 32px;
+  --m27-source-size-color-well-height: 16px;
+  --m27-source-size-checkboxes-radius: 3.5px;
+  --m27-source-size-combo-button-font-size-chevron: 9px;
+  --m27-source-size-combo-button-inset: 2px;
+  --m27-source-size-combo-button-text-inset-right: 20px;
+  --m27-source-size-combo-button-radius-button: 2.5px;
+  --m27-source-size-combo-button-width-button: 16px;
+  --m27-source-size-cursor-height: 14px;
+  --m27-source-size-dial-height-knob: 4px;
+  --m27-source-size-disclosure-font-size: 10px;
+  --m27-source-size-disclosure-radius: 4px;
+  --m27-source-size-dial-inset-knob: 2px;
+  --m27-source-size-fields-inset-left: 6px;
+  --m27-source-size-fields-inset-right: 6px;
+  --m27-source-size-fields-font-size-search-glyph: 11px;
+  --m27-source-size-fields-leading-search-glyph: 13px;
+  --m27-source-size-menu-height: 19px;
+  --m27-source-size-menu-font-size: 10px;
+  --m27-source-size-menu-font-size-symbol: 11px;
+  --m27-source-size-menu-width-symbol: 6px;
+  --m27-source-size-menu-inset-top-header: 3px;
+  --m27-source-size-menu-inset-bottom-header: 2px;
+  --m27-source-size-menu-inset-left-header: 14px;
+  --m27-source-size-popup-font-size-chevron: 10px;
+  --m27-source-size-popup-inset-left: 7px;
+  --m27-source-size-segmented-control-margins: 6px;
+  --m27-source-size-radio-button-height-dash: 1.7000000476837158px;
+  --m27-source-size-segmented-control-height-separator: 10px;
+  --m27-source-size-radio-button-spacing: 3px;
+  --m27-source-size-radio-button-width: 12px;
+  --m27-source-size-radio-button-width-dot: 4px;
+  --m27-source-size-radio-button-width-dash: 5.5px;
+  --m27-source-size-slider-knob-non-ticked-inset: 2px;
+  --m27-source-size-slider-knob-non-ticked-width: 16px;
+  --m27-source-size-slider-knob-non-ticked-height: 12px;
+  --m27-source-size-slider-knob-non-ticked-width-clicked: 20px;
+  --m27-source-size-slider-knob-non-ticked-height-clicked: 15px;
+  --m27-source-size-slider-knob-ticked-width: 8px;
+  --m27-source-size-slider-knob-ticked-height: 16px;
+  --m27-source-size-slider-knob-ticked-width-clicked: 10px;
+  --m27-source-size-slider-knob-ticked-height-clicked: 20px;
+  --m27-source-size-slider-track-inset-vertical: 1px;
+  --m27-source-size-slider-track-inset-horizontal: 1px;
+  --m27-source-size-slider-track-tick-spacing: 2px;
+  --m27-source-size-stepper-width: 13px;
+  --m27-source-size-stepper-radius: 4px;
+  --m27-source-size-stepper-font-size: 8px;
+  --m27-source-size-stepper-width-separator: 9px;
+  --m27-source-size-toggle-knob-width: 21px;
+  --m27-source-size-toggle-knob-height: 13px;
+  --m27-source-size-toggle-knob-clicked-width: 33px;
+  --m27-source-size-toggle-knob-clicked-height: 20px;
+  --m27-source-size-toggle-track-width: 36px;
+  --m27-source-size-toggle-track-height: var(--m27-source-size-global-height);
+  --m27-source-size-mode: 'Mini';
+
+  --m27-source-size-control-height: var(--m27-source-size-global-height);
+  --m27-source-size-control-radius: var(--m27-source-size-global-radius);
+  --m27-source-size-button-padding-inline: var(
+    --m27-source-size-button-padding-horizontal
+  );
+}
+
+[data-ui-platform='macos'][data-ui-platform-version='27']
+  [data-control-size='small'],
+[data-ui-platform='macos'][data-ui-platform-version='27'][data-control-size='small'] {
+  --m27-source-size-global-font-size: 11px;
+  --m27-source-size-arrow-button-font-size: 13px;
+  --m27-source-size-global-height: 20px;
+  --m27-source-size-global-radius: 5px;
+  --m27-source-size-button-padding-horizontal: 10px;
+  --m27-source-size-checkboxes-width: var(--m27-source-size-radio-button-width);
+  --m27-source-size-button-radius: var(--m27-source-size-global-radius);
+  --m27-source-size-checkboxes-width-checkmark: 9.3100004196167px;
+  --m27-source-size-checkboxes-height-checkmark: 8.930000305175781px;
+  --m27-source-size-color-well-width: 40px;
+  --m27-source-size-color-well-height: 20px;
+  --m27-source-size-checkboxes-radius: 4.5px;
+  --m27-source-size-combo-button-font-size-chevron: 10px;
+  --m27-source-size-combo-button-inset: 2px;
+  --m27-source-size-combo-button-text-inset-right: 24px;
+  --m27-source-size-combo-button-radius-button: 3.5px;
+  --m27-source-size-combo-button-width-button: 20px;
+  --m27-source-size-cursor-height: 16px;
+  --m27-source-size-dial-height-knob: 5px;
+  --m27-source-size-disclosure-font-size: 10px;
+  --m27-source-size-disclosure-radius: 5px;
+  --m27-source-size-dial-inset-knob: 2.5px;
+  --m27-source-size-fields-inset-left: 6px;
+  --m27-source-size-fields-inset-right: 6px;
+  --m27-source-size-fields-font-size-search-glyph: 13px;
+  --m27-source-size-fields-leading-search-glyph: 15px;
+  --m27-source-size-menu-height: 22px;
+  --m27-source-size-menu-font-size: 11px;
+  --m27-source-size-menu-font-size-symbol: 11px;
+  --m27-source-size-menu-width-symbol: 10px;
+  --m27-source-size-menu-inset-top-header: 4px;
+  --m27-source-size-menu-inset-bottom-header: 3px;
+  --m27-source-size-menu-inset-left-header: 18px;
+  --m27-source-size-popup-font-size-chevron: 11px;
+  --m27-source-size-popup-inset-left: 10px;
+  --m27-source-size-segmented-control-margins: 8px;
+  --m27-source-size-radio-button-height-dash: 2px;
+  --m27-source-size-segmented-control-height-separator: 12px;
+  --m27-source-size-radio-button-spacing: 3px;
+  --m27-source-size-radio-button-width: 14px;
+  --m27-source-size-radio-button-width-dot: 4.800000190734863px;
+  --m27-source-size-radio-button-width-dash: 6.5px;
+  --m27-source-size-slider-knob-non-ticked-inset: 1px;
+  --m27-source-size-slider-knob-non-ticked-width: 18px;
+  --m27-source-size-slider-knob-non-ticked-height: 14px;
+  --m27-source-size-slider-knob-non-ticked-width-clicked: 23px;
+  --m27-source-size-slider-knob-non-ticked-height-clicked: 18px;
+  --m27-source-size-slider-knob-ticked-width: 10px;
+  --m27-source-size-slider-knob-ticked-height: 18px;
+  --m27-source-size-slider-knob-ticked-width-clicked: 13px;
+  --m27-source-size-slider-knob-ticked-height-clicked: 23px;
+  --m27-source-size-slider-track-inset-vertical: 1px;
+  --m27-source-size-slider-track-inset-horizontal: 1px;
+  --m27-source-size-slider-track-tick-spacing: 2px;
+  --m27-source-size-stepper-width: 17px;
+  --m27-source-size-stepper-radius: 5px;
+  --m27-source-size-stepper-font-size: 9px;
+  --m27-source-size-stepper-width-separator: 11px;
+  --m27-source-size-toggle-knob-width: 26px;
+  --m27-source-size-toggle-knob-height: 16px;
+  --m27-source-size-toggle-knob-clicked-width: 40px;
+  --m27-source-size-toggle-knob-clicked-height: 26px;
+  --m27-source-size-toggle-track-width: 44px;
+  --m27-source-size-toggle-track-height: var(--m27-source-size-global-height);
+  --m27-source-size-mode: 'Small';
+
+  --m27-source-size-control-height: var(--m27-source-size-global-height);
+  --m27-source-size-control-radius: var(--m27-source-size-global-radius);
+  --m27-source-size-button-padding-inline: var(
+    --m27-source-size-button-padding-horizontal
+  );
+}
+
+[data-ui-platform='macos'][data-ui-platform-version='27']
+  [data-control-size='large'],
+[data-ui-platform='macos'][data-ui-platform-version='27'][data-control-size='large'] {
+  --m27-source-size-global-font-size: 13px;
+  --m27-source-size-arrow-button-font-size: 13px;
+  --m27-source-size-global-height: 28px;
+  --m27-source-size-global-radius: 7px;
+  --m27-source-size-button-padding-horizontal: 16px;
+  --m27-source-size-checkboxes-width: var(--m27-source-size-radio-button-width);
+  --m27-source-size-button-radius: 1000px;
+  --m27-source-size-checkboxes-width-checkmark: 11.720000267028809px;
+  --m27-source-size-checkboxes-height-checkmark: 11.300000190734863px;
+  --m27-source-size-color-well-width: 56px;
+  --m27-source-size-color-well-height: 28px;
+  --m27-source-size-checkboxes-radius: 6.5px;
+  --m27-source-size-combo-button-font-size-chevron: 12.5px;
+  --m27-source-size-combo-button-inset: 2px;
+  --m27-source-size-combo-button-text-inset-right: 28px;
+  --m27-source-size-combo-button-radius-button: 5.5px;
+  --m27-source-size-combo-button-width-button: 24px;
+  --m27-source-size-cursor-height: 18px;
+  --m27-source-size-dial-height-knob: 6px;
+  --m27-source-size-disclosure-font-size: 13px;
+  --m27-source-size-disclosure-radius: 1000px;
+  --m27-source-size-dial-inset-knob: 3px;
+  --m27-source-size-fields-inset-left: 8px;
+  --m27-source-size-fields-inset-right: 8px;
+  --m27-source-size-fields-font-size-search-glyph: 13px;
+  --m27-source-size-fields-leading-search-glyph: 15px;
+  --m27-source-size-menu-height: 24px;
+  --m27-source-size-menu-font-size: 13px;
+  --m27-source-size-menu-font-size-symbol: 13px;
+  --m27-source-size-menu-width-symbol: 12px;
+  --m27-source-size-menu-inset-top-header: 5px;
+  --m27-source-size-menu-inset-bottom-header: 4px;
+  --m27-source-size-menu-inset-left-header: 20px;
+  --m27-source-size-popup-font-size-chevron: 13px;
+  --m27-source-size-popup-inset-left: 14px;
+  --m27-source-size-segmented-control-margins: 12px;
+  --m27-source-size-radio-button-height-dash: 2px;
+  --m27-source-size-segmented-control-height-separator: 18px;
+  --m27-source-size-radio-button-spacing: 5px;
+  --m27-source-size-radio-button-width: 18px;
+  --m27-source-size-radio-button-width-dot: 5px;
+  --m27-source-size-radio-button-width-dash: 8px;
+  --m27-source-size-slider-knob-non-ticked-inset: -2px;
+  --m27-source-size-slider-knob-non-ticked-width: 24px;
+  --m27-source-size-slider-knob-non-ticked-height: 20px;
+  --m27-source-size-slider-knob-non-ticked-width-clicked: 30px;
+  --m27-source-size-slider-knob-non-ticked-height-clicked: 25px;
+  --m27-source-size-slider-knob-ticked-width: 24px;
+  --m27-source-size-slider-knob-ticked-height: 20px;
+  --m27-source-size-slider-knob-ticked-width-clicked: 30px;
+  --m27-source-size-slider-knob-ticked-height-clicked: 25px;
+  --m27-source-size-slider-track-inset-vertical: 0px;
+  --m27-source-size-slider-track-inset-horizontal: 0px;
+  --m27-source-size-slider-track-tick-spacing: 3px;
+  --m27-source-size-stepper-width: 23px;
+  --m27-source-size-stepper-radius: 7px;
+  --m27-source-size-stepper-font-size: 12px;
+  --m27-source-size-stepper-width-separator: 15px;
+  --m27-source-size-toggle-knob-width: 38px;
+  --m27-source-size-toggle-knob-height: 24px;
+  --m27-source-size-toggle-knob-clicked-width: 59px;
+  --m27-source-size-toggle-knob-clicked-height: 37px;
+  --m27-source-size-toggle-track-width: 64px;
+  --m27-source-size-toggle-track-height: var(--m27-source-size-global-height);
+  --m27-source-size-mode: 'Large';
+
+  --m27-source-size-control-height: var(--m27-source-size-global-height);
+  --m27-source-size-control-radius: var(--m27-source-size-global-radius);
+  --m27-source-size-button-padding-inline: var(
+    --m27-source-size-button-padding-horizontal
+  );
+}
+
+[data-ui-platform='macos'][data-ui-platform-version='27']
+  [data-control-size='xl'],
+[data-ui-platform='macos'][data-ui-platform-version='27'][data-control-size='xl'] {
+  --m27-source-size-global-font-size: 13px;
+  --m27-source-size-arrow-button-font-size: 13px;
+  --m27-source-size-global-height: 36px;
+  --m27-source-size-global-radius: 9px;
+  --m27-source-size-button-padding-horizontal: 16px;
+  --m27-source-size-checkboxes-width: var(--m27-source-size-radio-button-width);
+  --m27-source-size-button-radius: 1000px;
+  --m27-source-size-checkboxes-width-checkmark: 11.720000267028809px;
+  --m27-source-size-checkboxes-height-checkmark: 11.300000190734863px;
+  --m27-source-size-color-well-width: 72px;
+  --m27-source-size-color-well-height: 36px;
+  --m27-source-size-checkboxes-radius: 6.5px;
+  --m27-source-size-combo-button-font-size-chevron: 13px;
+  --m27-source-size-combo-button-inset: 3px;
+  --m27-source-size-combo-button-text-inset-right: 34px;
+  --m27-source-size-combo-button-radius-button: 6.5px;
+  --m27-source-size-combo-button-width-button: 30px;
+  --m27-source-size-cursor-height: 18px;
+  --m27-source-size-dial-height-knob: 7px;
+  --m27-source-size-disclosure-font-size: 13px;
+  --m27-source-size-disclosure-radius: 1000px;
+  --m27-source-size-dial-inset-knob: 3px;
+  --m27-source-size-fields-inset-left: 10px;
+  --m27-source-size-fields-inset-right: 10px;
+  --m27-source-size-fields-font-size-search-glyph: 13px;
+  --m27-source-size-fields-leading-search-glyph: 15px;
+  --m27-source-size-menu-height: 24px;
+  --m27-source-size-menu-font-size: 13px;
+  --m27-source-size-menu-font-size-symbol: 13px;
+  --m27-source-size-menu-width-symbol: 12px;
+  --m27-source-size-menu-inset-top-header: 5px;
+  --m27-source-size-menu-inset-bottom-header: 4px;
+  --m27-source-size-menu-inset-left-header: 20px;
+  --m27-source-size-popup-font-size-chevron: 13px;
+  --m27-source-size-popup-inset-left: 18px;
+  --m27-source-size-segmented-control-margins: 14px;
+  --m27-source-size-radio-button-height-dash: 2px;
+  --m27-source-size-segmented-control-height-separator: 20px;
+  --m27-source-size-radio-button-spacing: 7px;
+  --m27-source-size-radio-button-width: 18px;
+  --m27-source-size-radio-button-width-dot: 5px;
+  --m27-source-size-radio-button-width-dash: 8px;
+  --m27-source-size-slider-knob-non-ticked-inset: -2px;
+  --m27-source-size-slider-knob-non-ticked-width: 24px;
+  --m27-source-size-slider-knob-non-ticked-height: 20px;
+  --m27-source-size-slider-knob-non-ticked-width-clicked: 30px;
+  --m27-source-size-slider-knob-non-ticked-height-clicked: 25px;
+  --m27-source-size-slider-knob-ticked-width: 24px;
+  --m27-source-size-slider-knob-ticked-height: 20px;
+  --m27-source-size-slider-knob-ticked-width-clicked: 30px;
+  --m27-source-size-slider-knob-ticked-height-clicked: 25px;
+  --m27-source-size-slider-track-inset-vertical: 0px;
+  --m27-source-size-slider-track-inset-horizontal: 0px;
+  --m27-source-size-slider-track-tick-spacing: 3px;
+  --m27-source-size-stepper-width: 30px;
+  --m27-source-size-stepper-radius: 9px;
+  --m27-source-size-stepper-font-size: 12px;
+  --m27-source-size-stepper-width-separator: 20px;
+  --m27-source-size-toggle-knob-width: 47px;
+  --m27-source-size-toggle-knob-height: 30px;
+  --m27-source-size-toggle-knob-clicked-width: 73px;
+  --m27-source-size-toggle-knob-clicked-height: 46px;
+  --m27-source-size-toggle-track-width: 80px;
+  --m27-source-size-toggle-track-height: var(--m27-source-size-global-height);
+  --m27-source-size-mode: 'XL';
+
+  --m27-source-size-control-height: var(--m27-source-size-global-height);
+  --m27-source-size-control-radius: var(--m27-source-size-global-radius);
+  --m27-source-size-button-padding-inline: var(
+    --m27-source-size-button-padding-horizontal
+  );
+}