@pantoken/pantoken 0.2.4 → 0.2.5

package/dist/model.json

@@ -1698,6 +1698,12 @@
     "remarks": "See the `tabs.tab` and `tabs.panel` members for the individual tab buttons and their content panels.",
     "accessibility": "Wire the tab list with role=\"tablist\", each tab with role=\"tab\" and aria-selected, and each panel with role=\"tabpanel\".",
     "modifiers": [
+      {
+        "name": "-overflow-scroll",
+        "prop": "overflow",
+        "value": "scroll",
+        "description": "Keep the tab list on one line and let it scroll horizontally instead of wrapping, hiding the scrollbar."
+      },
       {
         "name": "-variant-secondary",
         "prop": "variant",
@@ -1883,7 +1889,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 1292,
+      "line": 1293,
       "column": 1
     }
   },
@@ -1965,7 +1971,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 1386,
+      "line": 1387,
       "column": 1
     }
   },
@@ -2089,7 +2095,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 1419,
+      "line": 1420,
       "column": 1
     }
   },
@@ -2267,7 +2273,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 1485,
+      "line": 1486,
       "column": 1
     }
   },
@@ -2357,7 +2363,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 1587,
+      "line": 1588,
       "column": 1
     }
   },
@@ -2485,7 +2491,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 1642,
+      "line": 1643,
       "column": 1
     }
   },
@@ -2536,7 +2542,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 1728,
+      "line": 1729,
       "column": 1
     }
   },
@@ -2583,7 +2589,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 1758,
+      "line": 1759,
       "column": 1
     }
   },
@@ -2646,7 +2652,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 1775,
+      "line": 1776,
       "column": 1
     }
   },
@@ -2716,7 +2722,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 1817,
+      "line": 1818,
       "column": 1
     }
   },
@@ -2787,7 +2793,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 1859,
+      "line": 1860,
       "column": 1
     }
   },
@@ -2863,7 +2869,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 1886,
+      "line": 1887,
       "column": 1
     }
   },
@@ -3065,7 +3071,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 1932,
+      "line": 1933,
       "column": 1
     }
   },
@@ -3196,7 +3202,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 2039,
+      "line": 2040,
       "column": 1
     }
   },
@@ -3333,7 +3339,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 2117,
+      "line": 2118,
       "column": 1
     }
   },
@@ -3393,7 +3399,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 2192,
+      "line": 2193,
       "column": 1
     }
   },
@@ -3433,6 +3439,11 @@
         "prop": "readonly",
         "description": "Read-only state."
       },
+      {
+        "name": "-required",
+        "prop": "required",
+        "description": "Show the required-field asterisk next to the label."
+      },
       {
         "name": "-size-large",
         "prop": "size",
@@ -3702,7 +3713,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 2220,
+      "line": 2221,
       "column": 1
     }
   },
@@ -3985,7 +3996,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 2490,
+      "line": 2492,
       "column": 1
     }
   },
@@ -4111,7 +4122,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 2783,
+      "line": 2785,
       "column": 1
     }
   },
@@ -4535,7 +4546,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 2865,
+      "line": 2867,
       "column": 1
     }
   },
@@ -4632,7 +4643,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 3093,
+      "line": 3095,
       "column": 1
     }
   },
@@ -4752,7 +4763,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 3128,
+      "line": 3130,
       "column": 1
     }
   },
@@ -4820,7 +4831,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 3195,
+      "line": 3197,
       "column": 1
     }
   },
@@ -4879,7 +4890,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 3219,
+      "line": 3221,
       "column": 1
     }
   },
@@ -5069,7 +5080,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 3240,
+      "line": 3242,
       "column": 1
     }
   },
@@ -5138,7 +5149,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 3361,
+      "line": 3363,
       "column": 1
     }
   },
@@ -5195,7 +5206,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 3394,
+      "line": 3396,
       "column": 1
     }
   },
@@ -5267,7 +5278,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 3438,
+      "line": 3440,
       "column": 1
     }
   },
@@ -5391,7 +5402,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 3473,
+      "line": 3475,
       "column": 1
     }
   },
@@ -5508,7 +5519,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 3559,
+      "line": 3561,
       "column": 1
     }
   },
@@ -5715,7 +5726,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 3676,
+      "line": 3678,
       "column": 1
     }
   },
@@ -5839,7 +5850,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 3941,
+      "line": 3943,
       "column": 1
     }
   },
@@ -5993,7 +6004,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 4004,
+      "line": 4006,
       "column": 1
     }
   },
@@ -6140,7 +6151,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 4111,
+      "line": 4113,
       "column": 1
     }
   },
@@ -6250,7 +6261,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 4311,
+      "line": 4313,
       "column": 1
     }
   },
@@ -6368,7 +6379,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 4372,
+      "line": 4374,
       "column": 1
     }
   },
@@ -6452,7 +6463,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 4462,
+      "line": 4464,
       "column": 1
     }
   },
@@ -6893,7 +6904,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 4509,
+      "line": 4511,
       "column": 1
     }
   },
@@ -7047,7 +7058,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 4773,
+      "line": 4775,
       "column": 1
     }
   },
@@ -7138,7 +7149,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 4878,
+      "line": 4880,
       "column": 1
     }
   },
@@ -7291,7 +7302,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 4932,
+      "line": 4934,
       "column": 1
     }
   },
@@ -7417,7 +7428,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 5043,
+      "line": 5045,
       "column": 1
     }
   },
@@ -7510,7 +7521,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 5099,
+      "line": 5101,
       "column": 1
     }
   },
@@ -7608,7 +7619,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 5158,
+      "line": 5160,
       "column": 1
     }
   },
@@ -7801,7 +7812,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 5209,
+      "line": 5211,
       "column": 1
     }
   },
@@ -7927,7 +7938,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 5358,
+      "line": 5360,
       "column": 1
     }
   },
@@ -8027,7 +8038,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 5459,
+      "line": 5461,
       "column": 1
     }
   },
@@ -8157,7 +8168,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 5504,
+      "line": 5506,
       "column": 1
     }
   },
@@ -8368,7 +8379,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 5595,
+      "line": 5597,
       "column": 1
     }
   },
@@ -8474,7 +8485,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 5771,
+      "line": 5773,
       "column": 1
     }
   },
@@ -8620,7 +8631,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 5855,
+      "line": 5857,
       "column": 1
     }
   },
@@ -8678,7 +8689,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 6002,
+      "line": 6005,
       "column": 1
     }
   },
@@ -8722,7 +8733,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 6038,
+      "line": 6041,
       "column": 1
     }
   },
@@ -8977,7 +8988,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 6064,
+      "line": 6067,
       "column": 1
     }
   },
@@ -9357,7 +9368,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 6128,
+      "line": 6131,
       "column": 1
     }
   },
@@ -9473,7 +9484,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 6327,
+      "line": 6330,
       "column": 1
     }
   },
@@ -9652,7 +9663,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 6395,
+      "line": 6398,
       "column": 1
     }
   },
@@ -9861,7 +9872,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 6523,
+      "line": 6526,
       "column": 1
     }
   },
@@ -9992,7 +10003,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 6680,
+      "line": 6683,
       "column": 1
     }
   },
@@ -10103,7 +10114,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 6778,
+      "line": 6781,
       "column": 1
     }
   },
@@ -10309,7 +10320,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 6864,
+      "line": 6867,
       "column": 1
     }
   },
@@ -10488,7 +10499,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 6931,
+      "line": 6934,
       "column": 1
     }
   },
@@ -10697,7 +10708,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 6997,
+      "line": 7000,
       "column": 1
     }
   },
@@ -10909,7 +10920,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 7078,
+      "line": 7081,
       "column": 1
     }
   },
@@ -11178,7 +11189,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 7162,
+      "line": 7165,
       "column": 1
     }
   },
@@ -11271,7 +11282,7 @@
       "profiles": {}
     },
     "source": {
-      "line": 7301,
+      "line": 7304,
       "column": 1
     }
   },
@@ -11727,7 +11738,2889 @@
       "profiles": {}
     },
     "source": {
-      "line": 7351,
+      "line": 7354,
+      "column": 1
+    }
+  },
+  {
+    "name": "layout",
+    "kind": "utility",
+    "className": ".--display-flex",
+    "summary": "Display and text-align utilities — `.--display-<value>` and `.--text-align-<value>` — as composable, global classes, usable bare or chained onto any component.",
+    "modifiers": [
+      {
+        "name": "--display-flex",
+        "prop": "",
+        "value": "display-flex",
+        "description": "Sets `display: flex`."
+      },
+      {
+        "name": "--display-*",
+        "prop": "-display",
+        "pattern": true,
+        "description": "Display utilities: `block`, `inline-block`, `inline`, `flex`, `inline-flex`, and `none`."
+      },
+      {
+        "name": "--text-align-*",
+        "prop": "-text-align",
+        "pattern": true,
+        "description": "Text-alignment utilities: `start`, `center`, `end`, and `justify`."
+      }
+    ],
+    "parts": [],
+    "shadowParts": [],
+    "pseudoElements": [],
+    "states": [],
+    "slots": [],
+    "todos": [],
+    "cssPropertiesConsumed": [],
+    "cssPropertiesDeclared": [],
+    "functions": [],
+    "animations": [],
+    "layers": [],
+    "conditions": [],
+    "examples": [
+      "<div class=\"--display-flex --text-align-center\">\n  <span>One</span>\n  <span>Two</span>\n</div>"
+    ],
+    "see": [],
+    "annotations": [],
+    "refs": [],
+    "decorators": [],
+    "compat": [],
+    "related": [],
+    "elements": {
+      "default": {
+        "any": true,
+        "allowed": [],
+        "include": [],
+        "exclude": [],
+        "groups": [],
+        "excludedGroups": []
+      },
+      "profiles": {}
+    },
+    "global": true,
+    "source": {
+      "line": 7475,
+      "column": 1
+    }
+  },
+  {
+    "name": "responsive",
+    "kind": "utility",
+    "className": "[class*=\"-hidden-\"],[class*=\"-show-\"]",
+    "summary": "Viewport- or container-width show/hide classes across a themed breakpoint scale.",
+    "remarks": "`.instui-hidden-max-<bp>`/`-hidden-min-<bp>` hide by viewport width; `.instui-show-max-<bp>`/`-show-min-<bp>` are the inverse (hidden by default, shown only inside the range via `display: revert`); the `-cq-` variants react to a `.instui-container` ancestor's width instead, not the viewport's. Scale tiers `xs`/`sm`/`md`/`lg`/`xl` (sourced from the IR's tray-width component tokens) are each aliased to a long-form spelling (`x-small`–`x-large`) and a device name (`mobile`/`phablet`/`tablet`/`laptop`/`desktop`) — both deprecated in favor of the short name — plus the unscaled, themed `content`/`content-full-width` tiers (the main content area's max-width).",
+    "modifiers": [
+      {
+        "name": "-cq-hidden-max-content",
+        "prop": "cq",
+        "value": "hidden-max-content",
+        "description": "Hide when the marked container is at or below the `content` breakpoint (`68.75em`)."
+      },
+      {
+        "name": "-cq-hidden-max-content-full-width",
+        "prop": "cq",
+        "value": "hidden-max-content-full-width",
+        "description": "Hide when the marked container is at or below the `content-full-width` breakpoint (`98.75em`)."
+      },
+      {
+        "name": "-cq-hidden-max-desktop",
+        "prop": "cq",
+        "value": "hidden-max-desktop",
+        "alias": {
+          "canonical": "-cq-hidden-max-xl"
+        }
+      },
+      {
+        "name": "-cq-hidden-max-laptop",
+        "prop": "cq",
+        "value": "hidden-max-laptop",
+        "alias": {
+          "canonical": "-cq-hidden-max-lg"
+        }
+      },
+      {
+        "name": "-cq-hidden-max-large",
+        "prop": "cq",
+        "value": "hidden-max-large",
+        "alias": {
+          "canonical": "-cq-hidden-max-lg"
+        }
+      },
+      {
+        "name": "-cq-hidden-max-lg",
+        "prop": "cq",
+        "value": "hidden-max-lg",
+        "description": "Hide when the marked container is at or below the `lg` breakpoint (`48em`)."
+      },
+      {
+        "name": "-cq-hidden-max-md",
+        "prop": "cq",
+        "value": "hidden-max-md",
+        "description": "Hide when the marked container is at or below the `md` breakpoint (`30em`)."
+      },
+      {
+        "name": "-cq-hidden-max-medium",
+        "prop": "cq",
+        "value": "hidden-max-medium",
+        "alias": {
+          "canonical": "-cq-hidden-max-md"
+        }
+      },
+      {
+        "name": "-cq-hidden-max-mobile",
+        "prop": "cq",
+        "value": "hidden-max-mobile",
+        "alias": {
+          "canonical": "-cq-hidden-max-xs"
+        }
+      },
+      {
+        "name": "-cq-hidden-max-phablet",
+        "prop": "cq",
+        "value": "hidden-max-phablet",
+        "alias": {
+          "canonical": "-cq-hidden-max-sm"
+        }
+      },
+      {
+        "name": "-cq-hidden-max-sm",
+        "prop": "cq",
+        "value": "hidden-max-sm",
+        "description": "Hide when the marked container is at or below the `sm` breakpoint (`20em`)."
+      },
+      {
+        "name": "-cq-hidden-max-small",
+        "prop": "cq",
+        "value": "hidden-max-small",
+        "alias": {
+          "canonical": "-cq-hidden-max-sm"
+        }
+      },
+      {
+        "name": "-cq-hidden-max-tablet",
+        "prop": "cq",
+        "value": "hidden-max-tablet",
+        "alias": {
+          "canonical": "-cq-hidden-max-md"
+        }
+      },
+      {
+        "name": "-cq-hidden-max-x-large",
+        "prop": "cq",
+        "value": "hidden-max-x-large",
+        "alias": {
+          "canonical": "-cq-hidden-max-xl"
+        }
+      },
+      {
+        "name": "-cq-hidden-max-x-small",
+        "prop": "cq",
+        "value": "hidden-max-x-small",
+        "alias": {
+          "canonical": "-cq-hidden-max-xs"
+        }
+      },
+      {
+        "name": "-cq-hidden-max-xl",
+        "prop": "cq",
+        "value": "hidden-max-xl",
+        "description": "Hide when the marked container is at or below the `xl` breakpoint (`62em`)."
+      },
+      {
+        "name": "-cq-hidden-max-xs",
+        "prop": "cq",
+        "value": "hidden-max-xs",
+        "description": "Hide when the marked container is at or below the `xs` breakpoint (`16em`)."
+      },
+      {
+        "name": "-cq-hidden-min-content",
+        "prop": "cq",
+        "value": "hidden-min-content",
+        "description": "Hide when the marked container is at or above the `content` breakpoint (`68.75em`)."
+      },
+      {
+        "name": "-cq-hidden-min-content-full-width",
+        "prop": "cq",
+        "value": "hidden-min-content-full-width",
+        "description": "Hide when the marked container is at or above the `content-full-width` breakpoint (`98.75em`)."
+      },
+      {
+        "name": "-cq-hidden-min-desktop",
+        "prop": "cq",
+        "value": "hidden-min-desktop",
+        "alias": {
+          "canonical": "-cq-hidden-min-xl"
+        }
+      },
+      {
+        "name": "-cq-hidden-min-laptop",
+        "prop": "cq",
+        "value": "hidden-min-laptop",
+        "alias": {
+          "canonical": "-cq-hidden-min-lg"
+        }
+      },
+      {
+        "name": "-cq-hidden-min-large",
+        "prop": "cq",
+        "value": "hidden-min-large",
+        "alias": {
+          "canonical": "-cq-hidden-min-lg"
+        }
+      },
+      {
+        "name": "-cq-hidden-min-lg",
+        "prop": "cq",
+        "value": "hidden-min-lg",
+        "description": "Hide when the marked container is at or above the `lg` breakpoint (`48em`)."
+      },
+      {
+        "name": "-cq-hidden-min-md",
+        "prop": "cq",
+        "value": "hidden-min-md",
+        "description": "Hide when the marked container is at or above the `md` breakpoint (`30em`)."
+      },
+      {
+        "name": "-cq-hidden-min-medium",
+        "prop": "cq",
+        "value": "hidden-min-medium",
+        "alias": {
+          "canonical": "-cq-hidden-min-md"
+        }
+      },
+      {
+        "name": "-cq-hidden-min-mobile",
+        "prop": "cq",
+        "value": "hidden-min-mobile",
+        "alias": {
+          "canonical": "-cq-hidden-min-xs"
+        }
+      },
+      {
+        "name": "-cq-hidden-min-phablet",
+        "prop": "cq",
+        "value": "hidden-min-phablet",
+        "alias": {
+          "canonical": "-cq-hidden-min-sm"
+        }
+      },
+      {
+        "name": "-cq-hidden-min-sm",
+        "prop": "cq",
+        "value": "hidden-min-sm",
+        "description": "Hide when the marked container is at or above the `sm` breakpoint (`20em`)."
+      },
+      {
+        "name": "-cq-hidden-min-small",
+        "prop": "cq",
+        "value": "hidden-min-small",
+        "alias": {
+          "canonical": "-cq-hidden-min-sm"
+        }
+      },
+      {
+        "name": "-cq-hidden-min-tablet",
+        "prop": "cq",
+        "value": "hidden-min-tablet",
+        "alias": {
+          "canonical": "-cq-hidden-min-md"
+        }
+      },
+      {
+        "name": "-cq-hidden-min-x-large",
+        "prop": "cq",
+        "value": "hidden-min-x-large",
+        "alias": {
+          "canonical": "-cq-hidden-min-xl"
+        }
+      },
+      {
+        "name": "-cq-hidden-min-x-small",
+        "prop": "cq",
+        "value": "hidden-min-x-small",
+        "alias": {
+          "canonical": "-cq-hidden-min-xs"
+        }
+      },
+      {
+        "name": "-cq-hidden-min-xl",
+        "prop": "cq",
+        "value": "hidden-min-xl",
+        "description": "Hide when the marked container is at or above the `xl` breakpoint (`62em`)."
+      },
+      {
+        "name": "-cq-hidden-min-xs",
+        "prop": "cq",
+        "value": "hidden-min-xs",
+        "description": "Hide when the marked container is at or above the `xs` breakpoint (`16em`)."
+      },
+      {
+        "name": "-cq-show-max-content",
+        "prop": "cq",
+        "value": "show-max-content",
+        "description": "Show when the marked container is at or below the `content` breakpoint (`68.75em`); hidden otherwise."
+      },
+      {
+        "name": "-cq-show-max-content-full-width",
+        "prop": "cq",
+        "value": "show-max-content-full-width",
+        "description": "Show when the marked container is at or below the `content-full-width` breakpoint (`98.75em`); hidden otherwise."
+      },
+      {
+        "name": "-cq-show-max-desktop",
+        "prop": "cq",
+        "value": "show-max-desktop",
+        "alias": {
+          "canonical": "-cq-show-max-xl"
+        }
+      },
+      {
+        "name": "-cq-show-max-laptop",
+        "prop": "cq",
+        "value": "show-max-laptop",
+        "alias": {
+          "canonical": "-cq-show-max-lg"
+        }
+      },
+      {
+        "name": "-cq-show-max-large",
+        "prop": "cq",
+        "value": "show-max-large",
+        "alias": {
+          "canonical": "-cq-show-max-lg"
+        }
+      },
+      {
+        "name": "-cq-show-max-lg",
+        "prop": "cq",
+        "value": "show-max-lg",
+        "description": "Show when the marked container is at or below the `lg` breakpoint (`48em`); hidden otherwise."
+      },
+      {
+        "name": "-cq-show-max-md",
+        "prop": "cq",
+        "value": "show-max-md",
+        "description": "Show when the marked container is at or below the `md` breakpoint (`30em`); hidden otherwise."
+      },
+      {
+        "name": "-cq-show-max-medium",
+        "prop": "cq",
+        "value": "show-max-medium",
+        "alias": {
+          "canonical": "-cq-show-max-md"
+        }
+      },
+      {
+        "name": "-cq-show-max-mobile",
+        "prop": "cq",
+        "value": "show-max-mobile",
+        "alias": {
+          "canonical": "-cq-show-max-xs"
+        }
+      },
+      {
+        "name": "-cq-show-max-phablet",
+        "prop": "cq",
+        "value": "show-max-phablet",
+        "alias": {
+          "canonical": "-cq-show-max-sm"
+        }
+      },
+      {
+        "name": "-cq-show-max-sm",
+        "prop": "cq",
+        "value": "show-max-sm",
+        "description": "Show when the marked container is at or below the `sm` breakpoint (`20em`); hidden otherwise."
+      },
+      {
+        "name": "-cq-show-max-small",
+        "prop": "cq",
+        "value": "show-max-small",
+        "alias": {
+          "canonical": "-cq-show-max-sm"
+        }
+      },
+      {
+        "name": "-cq-show-max-tablet",
+        "prop": "cq",
+        "value": "show-max-tablet",
+        "alias": {
+          "canonical": "-cq-show-max-md"
+        }
+      },
+      {
+        "name": "-cq-show-max-x-large",
+        "prop": "cq",
+        "value": "show-max-x-large",
+        "alias": {
+          "canonical": "-cq-show-max-xl"
+        }
+      },
+      {
+        "name": "-cq-show-max-x-small",
+        "prop": "cq",
+        "value": "show-max-x-small",
+        "alias": {
+          "canonical": "-cq-show-max-xs"
+        }
+      },
+      {
+        "name": "-cq-show-max-xl",
+        "prop": "cq",
+        "value": "show-max-xl",
+        "description": "Show when the marked container is at or below the `xl` breakpoint (`62em`); hidden otherwise."
+      },
+      {
+        "name": "-cq-show-max-xs",
+        "prop": "cq",
+        "value": "show-max-xs",
+        "description": "Show when the marked container is at or below the `xs` breakpoint (`16em`); hidden otherwise."
+      },
+      {
+        "name": "-cq-show-min-content",
+        "prop": "cq",
+        "value": "show-min-content",
+        "description": "Show when the marked container is at or above the `content` breakpoint (`68.75em`); hidden otherwise."
+      },
+      {
+        "name": "-cq-show-min-content-full-width",
+        "prop": "cq",
+        "value": "show-min-content-full-width",
+        "description": "Show when the marked container is at or above the `content-full-width` breakpoint (`98.75em`); hidden otherwise."
+      },
+      {
+        "name": "-cq-show-min-desktop",
+        "prop": "cq",
+        "value": "show-min-desktop",
+        "alias": {
+          "canonical": "-cq-show-min-xl"
+        }
+      },
+      {
+        "name": "-cq-show-min-laptop",
+        "prop": "cq",
+        "value": "show-min-laptop",
+        "alias": {
+          "canonical": "-cq-show-min-lg"
+        }
+      },
+      {
+        "name": "-cq-show-min-large",
+        "prop": "cq",
+        "value": "show-min-large",
+        "alias": {
+          "canonical": "-cq-show-min-lg"
+        }
+      },
+      {
+        "name": "-cq-show-min-lg",
+        "prop": "cq",
+        "value": "show-min-lg",
+        "description": "Show when the marked container is at or above the `lg` breakpoint (`48em`); hidden otherwise."
+      },
+      {
+        "name": "-cq-show-min-md",
+        "prop": "cq",
+        "value": "show-min-md",
+        "description": "Show when the marked container is at or above the `md` breakpoint (`30em`); hidden otherwise."
+      },
+      {
+        "name": "-cq-show-min-medium",
+        "prop": "cq",
+        "value": "show-min-medium",
+        "alias": {
+          "canonical": "-cq-show-min-md"
+        }
+      },
+      {
+        "name": "-cq-show-min-mobile",
+        "prop": "cq",
+        "value": "show-min-mobile",
+        "alias": {
+          "canonical": "-cq-show-min-xs"
+        }
+      },
+      {
+        "name": "-cq-show-min-phablet",
+        "prop": "cq",
+        "value": "show-min-phablet",
+        "alias": {
+          "canonical": "-cq-show-min-sm"
+        }
+      },
+      {
+        "name": "-cq-show-min-sm",
+        "prop": "cq",
+        "value": "show-min-sm",
+        "description": "Show when the marked container is at or above the `sm` breakpoint (`20em`); hidden otherwise."
+      },
+      {
+        "name": "-cq-show-min-small",
+        "prop": "cq",
+        "value": "show-min-small",
+        "alias": {
+          "canonical": "-cq-show-min-sm"
+        }
+      },
+      {
+        "name": "-cq-show-min-tablet",
+        "prop": "cq",
+        "value": "show-min-tablet",
+        "alias": {
+          "canonical": "-cq-show-min-md"
+        }
+      },
+      {
+        "name": "-cq-show-min-x-large",
+        "prop": "cq",
+        "value": "show-min-x-large",
+        "alias": {
+          "canonical": "-cq-show-min-xl"
+        }
+      },
+      {
+        "name": "-cq-show-min-x-small",
+        "prop": "cq",
+        "value": "show-min-x-small",
+        "alias": {
+          "canonical": "-cq-show-min-xs"
+        }
+      },
+      {
+        "name": "-cq-show-min-xl",
+        "prop": "cq",
+        "value": "show-min-xl",
+        "description": "Show when the marked container is at or above the `xl` breakpoint (`62em`); hidden otherwise."
+      },
+      {
+        "name": "-cq-show-min-xs",
+        "prop": "cq",
+        "value": "show-min-xs",
+        "description": "Show when the marked container is at or above the `xs` breakpoint (`16em`); hidden otherwise."
+      },
+      {
+        "name": "-hidden-max-content",
+        "prop": "hidden",
+        "value": "max-content",
+        "description": "Hide when the viewport is at or below the `content` breakpoint (`68.75em`)."
+      },
+      {
+        "name": "-hidden-max-content-full-width",
+        "prop": "hidden",
+        "value": "max-content-full-width",
+        "description": "Hide when the viewport is at or below the `content-full-width` breakpoint (`98.75em`)."
+      },
+      {
+        "name": "-hidden-max-desktop",
+        "prop": "hidden",
+        "value": "max-desktop",
+        "alias": {
+          "canonical": "-hidden-max-xl"
+        }
+      },
+      {
+        "name": "-hidden-max-laptop",
+        "prop": "hidden",
+        "value": "max-laptop",
+        "alias": {
+          "canonical": "-hidden-max-lg"
+        }
+      },
+      {
+        "name": "-hidden-max-large",
+        "prop": "hidden",
+        "value": "max-large",
+        "alias": {
+          "canonical": "-hidden-max-lg"
+        }
+      },
+      {
+        "name": "-hidden-max-lg",
+        "prop": "hidden",
+        "value": "max-lg",
+        "description": "Hide when the viewport is at or below the `lg` breakpoint (`48em`)."
+      },
+      {
+        "name": "-hidden-max-md",
+        "prop": "hidden",
+        "value": "max-md",
+        "description": "Hide when the viewport is at or below the `md` breakpoint (`30em`)."
+      },
+      {
+        "name": "-hidden-max-medium",
+        "prop": "hidden",
+        "value": "max-medium",
+        "alias": {
+          "canonical": "-hidden-max-md"
+        }
+      },
+      {
+        "name": "-hidden-max-mobile",
+        "prop": "hidden",
+        "value": "max-mobile",
+        "alias": {
+          "canonical": "-hidden-max-xs"
+        }
+      },
+      {
+        "name": "-hidden-max-phablet",
+        "prop": "hidden",
+        "value": "max-phablet",
+        "alias": {
+          "canonical": "-hidden-max-sm"
+        }
+      },
+      {
+        "name": "-hidden-max-sm",
+        "prop": "hidden",
+        "value": "max-sm",
+        "description": "Hide when the viewport is at or below the `sm` breakpoint (`20em`)."
+      },
+      {
+        "name": "-hidden-max-small",
+        "prop": "hidden",
+        "value": "max-small",
+        "alias": {
+          "canonical": "-hidden-max-sm"
+        }
+      },
+      {
+        "name": "-hidden-max-tablet",
+        "prop": "hidden",
+        "value": "max-tablet",
+        "alias": {
+          "canonical": "-hidden-max-md"
+        }
+      },
+      {
+        "name": "-hidden-max-x-large",
+        "prop": "hidden",
+        "value": "max-x-large",
+        "alias": {
+          "canonical": "-hidden-max-xl"
+        }
+      },
+      {
+        "name": "-hidden-max-x-small",
+        "prop": "hidden",
+        "value": "max-x-small",
+        "alias": {
+          "canonical": "-hidden-max-xs"
+        }
+      },
+      {
+        "name": "-hidden-max-xl",
+        "prop": "hidden",
+        "value": "max-xl",
+        "description": "Hide when the viewport is at or below the `xl` breakpoint (`62em`)."
+      },
+      {
+        "name": "-hidden-max-xs",
+        "prop": "hidden",
+        "value": "max-xs",
+        "description": "Hide when the viewport is at or below the `xs` breakpoint (`16em`)."
+      },
+      {
+        "name": "-hidden-min-content",
+        "prop": "hidden",
+        "value": "min-content",
+        "description": "Hide when the viewport is at or above the `content` breakpoint (`68.75em`)."
+      },
+      {
+        "name": "-hidden-min-content-full-width",
+        "prop": "hidden",
+        "value": "min-content-full-width",
+        "description": "Hide when the viewport is at or above the `content-full-width` breakpoint (`98.75em`)."
+      },
+      {
+        "name": "-hidden-min-desktop",
+        "prop": "hidden",
+        "value": "min-desktop",
+        "alias": {
+          "canonical": "-hidden-min-xl"
+        }
+      },
+      {
+        "name": "-hidden-min-laptop",
+        "prop": "hidden",
+        "value": "min-laptop",
+        "alias": {
+          "canonical": "-hidden-min-lg"
+        }
+      },
+      {
+        "name": "-hidden-min-large",
+        "prop": "hidden",
+        "value": "min-large",
+        "alias": {
+          "canonical": "-hidden-min-lg"
+        }
+      },
+      {
+        "name": "-hidden-min-lg",
+        "prop": "hidden",
+        "value": "min-lg",
+        "description": "Hide when the viewport is at or above the `lg` breakpoint (`48em`)."
+      },
+      {
+        "name": "-hidden-min-md",
+        "prop": "hidden",
+        "value": "min-md",
+        "description": "Hide when the viewport is at or above the `md` breakpoint (`30em`)."
+      },
+      {
+        "name": "-hidden-min-medium",
+        "prop": "hidden",
+        "value": "min-medium",
+        "alias": {
+          "canonical": "-hidden-min-md"
+        }
+      },
+      {
+        "name": "-hidden-min-mobile",
+        "prop": "hidden",
+        "value": "min-mobile",
+        "alias": {
+          "canonical": "-hidden-min-xs"
+        }
+      },
+      {
+        "name": "-hidden-min-phablet",
+        "prop": "hidden",
+        "value": "min-phablet",
+        "alias": {
+          "canonical": "-hidden-min-sm"
+        }
+      },
+      {
+        "name": "-hidden-min-sm",
+        "prop": "hidden",
+        "value": "min-sm",
+        "description": "Hide when the viewport is at or above the `sm` breakpoint (`20em`)."
+      },
+      {
+        "name": "-hidden-min-small",
+        "prop": "hidden",
+        "value": "min-small",
+        "alias": {
+          "canonical": "-hidden-min-sm"
+        }
+      },
+      {
+        "name": "-hidden-min-tablet",
+        "prop": "hidden",
+        "value": "min-tablet",
+        "alias": {
+          "canonical": "-hidden-min-md"
+        }
+      },
+      {
+        "name": "-hidden-min-x-large",
+        "prop": "hidden",
+        "value": "min-x-large",
+        "alias": {
+          "canonical": "-hidden-min-xl"
+        }
+      },
+      {
+        "name": "-hidden-min-x-small",
+        "prop": "hidden",
+        "value": "min-x-small",
+        "alias": {
+          "canonical": "-hidden-min-xs"
+        }
+      },
+      {
+        "name": "-hidden-min-xl",
+        "prop": "hidden",
+        "value": "min-xl",
+        "description": "Hide when the viewport is at or above the `xl` breakpoint (`62em`)."
+      },
+      {
+        "name": "-hidden-min-xs",
+        "prop": "hidden",
+        "value": "min-xs",
+        "description": "Hide when the viewport is at or above the `xs` breakpoint (`16em`)."
+      },
+      {
+        "name": "-show-max-content",
+        "prop": "show",
+        "value": "max-content",
+        "description": "Show (inverse of `-hidden-min-content`) when the viewport is at or below the `content` breakpoint (`68.75em`); hidden otherwise."
+      },
+      {
+        "name": "-show-max-content-full-width",
+        "prop": "show",
+        "value": "max-content-full-width",
+        "description": "Show (inverse of `-hidden-min-content-full-width`) when the viewport is at or below the `content-full-width` breakpoint (`98.75em`); hidden otherwise."
+      },
+      {
+        "name": "-show-max-desktop",
+        "prop": "show",
+        "value": "max-desktop",
+        "alias": {
+          "canonical": "-show-max-xl"
+        }
+      },
+      {
+        "name": "-show-max-laptop",
+        "prop": "show",
+        "value": "max-laptop",
+        "alias": {
+          "canonical": "-show-max-lg"
+        }
+      },
+      {
+        "name": "-show-max-large",
+        "prop": "show",
+        "value": "max-large",
+        "alias": {
+          "canonical": "-show-max-lg"
+        }
+      },
+      {
+        "name": "-show-max-lg",
+        "prop": "show",
+        "value": "max-lg",
+        "description": "Show (inverse of `-hidden-min-lg`) when the viewport is at or below the `lg` breakpoint (`48em`); hidden otherwise."
+      },
+      {
+        "name": "-show-max-md",
+        "prop": "show",
+        "value": "max-md",
+        "description": "Show (inverse of `-hidden-min-md`) when the viewport is at or below the `md` breakpoint (`30em`); hidden otherwise."
+      },
+      {
+        "name": "-show-max-medium",
+        "prop": "show",
+        "value": "max-medium",
+        "alias": {
+          "canonical": "-show-max-md"
+        }
+      },
+      {
+        "name": "-show-max-mobile",
+        "prop": "show",
+        "value": "max-mobile",
+        "alias": {
+          "canonical": "-show-max-xs"
+        }
+      },
+      {
+        "name": "-show-max-phablet",
+        "prop": "show",
+        "value": "max-phablet",
+        "alias": {
+          "canonical": "-show-max-sm"
+        }
+      },
+      {
+        "name": "-show-max-sm",
+        "prop": "show",
+        "value": "max-sm",
+        "description": "Show (inverse of `-hidden-min-sm`) when the viewport is at or below the `sm` breakpoint (`20em`); hidden otherwise."
+      },
+      {
+        "name": "-show-max-small",
+        "prop": "show",
+        "value": "max-small",
+        "alias": {
+          "canonical": "-show-max-sm"
+        }
+      },
+      {
+        "name": "-show-max-tablet",
+        "prop": "show",
+        "value": "max-tablet",
+        "alias": {
+          "canonical": "-show-max-md"
+        }
+      },
+      {
+        "name": "-show-max-x-large",
+        "prop": "show",
+        "value": "max-x-large",
+        "alias": {
+          "canonical": "-show-max-xl"
+        }
+      },
+      {
+        "name": "-show-max-x-small",
+        "prop": "show",
+        "value": "max-x-small",
+        "alias": {
+          "canonical": "-show-max-xs"
+        }
+      },
+      {
+        "name": "-show-max-xl",
+        "prop": "show",
+        "value": "max-xl",
+        "description": "Show (inverse of `-hidden-min-xl`) when the viewport is at or below the `xl` breakpoint (`62em`); hidden otherwise."
+      },
+      {
+        "name": "-show-max-xs",
+        "prop": "show",
+        "value": "max-xs",
+        "description": "Show (inverse of `-hidden-min-xs`) when the viewport is at or below the `xs` breakpoint (`16em`); hidden otherwise."
+      },
+      {
+        "name": "-show-min-content",
+        "prop": "show",
+        "value": "min-content",
+        "description": "Show (inverse of `-hidden-max-content`) when the viewport is at or above the `content` breakpoint (`68.75em`); hidden otherwise."
+      },
+      {
+        "name": "-show-min-content-full-width",
+        "prop": "show",
+        "value": "min-content-full-width",
+        "description": "Show (inverse of `-hidden-max-content-full-width`) when the viewport is at or above the `content-full-width` breakpoint (`98.75em`); hidden otherwise."
+      },
+      {
+        "name": "-show-min-desktop",
+        "prop": "show",
+        "value": "min-desktop",
+        "alias": {
+          "canonical": "-show-min-xl"
+        }
+      },
+      {
+        "name": "-show-min-laptop",
+        "prop": "show",
+        "value": "min-laptop",
+        "alias": {
+          "canonical": "-show-min-lg"
+        }
+      },
+      {
+        "name": "-show-min-large",
+        "prop": "show",
+        "value": "min-large",
+        "alias": {
+          "canonical": "-show-min-lg"
+        }
+      },
+      {
+        "name": "-show-min-lg",
+        "prop": "show",
+        "value": "min-lg",
+        "description": "Show (inverse of `-hidden-max-lg`) when the viewport is at or above the `lg` breakpoint (`48em`); hidden otherwise."
+      },
+      {
+        "name": "-show-min-md",
+        "prop": "show",
+        "value": "min-md",
+        "description": "Show (inverse of `-hidden-max-md`) when the viewport is at or above the `md` breakpoint (`30em`); hidden otherwise."
+      },
+      {
+        "name": "-show-min-medium",
+        "prop": "show",
+        "value": "min-medium",
+        "alias": {
+          "canonical": "-show-min-md"
+        }
+      },
+      {
+        "name": "-show-min-mobile",
+        "prop": "show",
+        "value": "min-mobile",
+        "alias": {
+          "canonical": "-show-min-xs"
+        }
+      },
+      {
+        "name": "-show-min-phablet",
+        "prop": "show",
+        "value": "min-phablet",
+        "alias": {
+          "canonical": "-show-min-sm"
+        }
+      },
+      {
+        "name": "-show-min-sm",
+        "prop": "show",
+        "value": "min-sm",
+        "description": "Show (inverse of `-hidden-max-sm`) when the viewport is at or above the `sm` breakpoint (`20em`); hidden otherwise."
+      },
+      {
+        "name": "-show-min-small",
+        "prop": "show",
+        "value": "min-small",
+        "alias": {
+          "canonical": "-show-min-sm"
+        }
+      },
+      {
+        "name": "-show-min-tablet",
+        "prop": "show",
+        "value": "min-tablet",
+        "alias": {
+          "canonical": "-show-min-md"
+        }
+      },
+      {
+        "name": "-show-min-x-large",
+        "prop": "show",
+        "value": "min-x-large",
+        "alias": {
+          "canonical": "-show-min-xl"
+        }
+      },
+      {
+        "name": "-show-min-x-small",
+        "prop": "show",
+        "value": "min-x-small",
+        "alias": {
+          "canonical": "-show-min-xs"
+        }
+      },
+      {
+        "name": "-show-min-xl",
+        "prop": "show",
+        "value": "min-xl",
+        "description": "Show (inverse of `-hidden-max-xl`) when the viewport is at or above the `xl` breakpoint (`62em`); hidden otherwise."
+      },
+      {
+        "name": "-show-min-xs",
+        "prop": "show",
+        "value": "min-xs",
+        "description": "Show (inverse of `-hidden-max-xs`) when the viewport is at or above the `xs` breakpoint (`16em`); hidden otherwise."
+      }
+    ],
+    "parts": [],
+    "shadowParts": [],
+    "pseudoElements": [],
+    "states": [],
+    "slots": [],
+    "todos": [],
+    "cssPropertiesConsumed": [
+      {
+        "name": "--instui-component-tray-width-lg"
+      },
+      {
+        "name": "--instui-component-tray-width-md"
+      },
+      {
+        "name": "--instui-component-tray-width-sm"
+      },
+      {
+        "name": "--instui-component-tray-width-xl"
+      },
+      {
+        "name": "--instui-component-tray-width-xs"
+      }
+    ],
+    "cssPropertiesDeclared": [
+      {
+        "name": "--pantoken-bp-content",
+        "syntax": "<length>",
+        "inherits": true,
+        "defaultValue": "68.75em",
+        "description": "The `content` breakpoint's value (`68.75em`, hand-authored, themed (not in the token IR)). Overriding it does not move the compiled `@media`/`@container` thresholds above."
+      },
+      {
+        "name": "--pantoken-bp-content-full-width",
+        "syntax": "<length>",
+        "inherits": true,
+        "defaultValue": "98.75em",
+        "description": "The `content-full-width` breakpoint's value (`98.75em`, hand-authored, themed (not in the token IR)). Overriding it does not move the compiled `@media`/`@container` thresholds above."
+      },
+      {
+        "name": "--pantoken-bp-lg",
+        "syntax": "<length>",
+        "inherits": true,
+        "defaultValue": "48em",
+        "description": "The `lg` breakpoint's value (`48em`, mirrors `--instui-component-tray-width-lg`). Overriding it does not move the compiled `@media`/`@container` thresholds above."
+      },
+      {
+        "name": "--pantoken-bp-md",
+        "syntax": "<length>",
+        "inherits": true,
+        "defaultValue": "30em",
+        "description": "The `md` breakpoint's value (`30em`, mirrors `--instui-component-tray-width-md`). Overriding it does not move the compiled `@media`/`@container` thresholds above."
+      },
+      {
+        "name": "--pantoken-bp-sm",
+        "syntax": "<length>",
+        "inherits": true,
+        "defaultValue": "20em",
+        "description": "The `sm` breakpoint's value (`20em`, mirrors `--instui-component-tray-width-sm`). Overriding it does not move the compiled `@media`/`@container` thresholds above."
+      },
+      {
+        "name": "--pantoken-bp-xl",
+        "syntax": "<length>",
+        "inherits": true,
+        "defaultValue": "62em",
+        "description": "The `xl` breakpoint's value (`62em`, mirrors `--instui-component-tray-width-xl`). Overriding it does not move the compiled `@media`/`@container` thresholds above."
+      },
+      {
+        "name": "--pantoken-bp-xs",
+        "syntax": "<length>",
+        "inherits": true,
+        "defaultValue": "16em",
+        "description": "The `xs` breakpoint's value (`16em`, mirrors `--instui-component-tray-width-xs`). Overriding it does not move the compiled `@media`/`@container` thresholds above."
+      }
+    ],
+    "functions": [],
+    "animations": [],
+    "layers": [],
+    "conditions": [
+      {
+        "type": "media",
+        "query": "(max-width: 16em)",
+        "description": "Upper bound of the `xs` breakpoint."
+      },
+      {
+        "type": "media",
+        "query": "(min-width: 16em)",
+        "description": "Lower bound of the `xs` breakpoint."
+      },
+      {
+        "type": "media",
+        "query": "(max-width: 20em)",
+        "description": "Upper bound of the `sm` breakpoint."
+      },
+      {
+        "type": "media",
+        "query": "(min-width: 20em)",
+        "description": "Lower bound of the `sm` breakpoint."
+      },
+      {
+        "type": "media",
+        "query": "(max-width: 30em)",
+        "description": "Upper bound of the `md` breakpoint."
+      },
+      {
+        "type": "media",
+        "query": "(min-width: 30em)",
+        "description": "Lower bound of the `md` breakpoint."
+      },
+      {
+        "type": "media",
+        "query": "(max-width: 48em)",
+        "description": "Upper bound of the `lg` breakpoint."
+      },
+      {
+        "type": "media",
+        "query": "(min-width: 48em)",
+        "description": "Lower bound of the `lg` breakpoint."
+      },
+      {
+        "type": "media",
+        "query": "(max-width: 62em)",
+        "description": "Upper bound of the `xl` breakpoint."
+      },
+      {
+        "type": "media",
+        "query": "(min-width: 62em)",
+        "description": "Lower bound of the `xl` breakpoint."
+      },
+      {
+        "type": "media",
+        "query": "(max-width: 68.75em)",
+        "description": "Upper bound of the `content` breakpoint."
+      },
+      {
+        "type": "media",
+        "query": "(min-width: 68.75em)",
+        "description": "Lower bound of the `content` breakpoint."
+      },
+      {
+        "type": "media",
+        "query": "(max-width: 98.75em)",
+        "description": "Upper bound of the `content-full-width` breakpoint."
+      },
+      {
+        "type": "media",
+        "query": "(min-width: 98.75em)",
+        "description": "Lower bound of the `content-full-width` breakpoint."
+      },
+      {
+        "type": "container",
+        "query": "(max-width: 16em)",
+        "description": "Upper bound of the `xs` breakpoint, evaluated against a marked container."
+      },
+      {
+        "type": "container",
+        "query": "(min-width: 16em)",
+        "description": "Lower bound of the `xs` breakpoint, evaluated against a marked container."
+      },
+      {
+        "type": "container",
+        "query": "(max-width: 20em)",
+        "description": "Upper bound of the `sm` breakpoint, evaluated against a marked container."
+      },
+      {
+        "type": "container",
+        "query": "(min-width: 20em)",
+        "description": "Lower bound of the `sm` breakpoint, evaluated against a marked container."
+      },
+      {
+        "type": "container",
+        "query": "(max-width: 30em)",
+        "description": "Upper bound of the `md` breakpoint, evaluated against a marked container."
+      },
+      {
+        "type": "container",
+        "query": "(min-width: 30em)",
+        "description": "Lower bound of the `md` breakpoint, evaluated against a marked container."
+      },
+      {
+        "type": "container",
+        "query": "(max-width: 48em)",
+        "description": "Upper bound of the `lg` breakpoint, evaluated against a marked container."
+      },
+      {
+        "type": "container",
+        "query": "(min-width: 48em)",
+        "description": "Lower bound of the `lg` breakpoint, evaluated against a marked container."
+      },
+      {
+        "type": "container",
+        "query": "(max-width: 62em)",
+        "description": "Upper bound of the `xl` breakpoint, evaluated against a marked container."
+      },
+      {
+        "type": "container",
+        "query": "(min-width: 62em)",
+        "description": "Lower bound of the `xl` breakpoint, evaluated against a marked container."
+      },
+      {
+        "type": "container",
+        "query": "(max-width: 68.75em)",
+        "description": "Upper bound of the `content` breakpoint, evaluated against a marked container."
+      },
+      {
+        "type": "container",
+        "query": "(min-width: 68.75em)",
+        "description": "Lower bound of the `content` breakpoint, evaluated against a marked container."
+      },
+      {
+        "type": "container",
+        "query": "(max-width: 98.75em)",
+        "description": "Upper bound of the `content-full-width` breakpoint, evaluated against a marked container."
+      },
+      {
+        "type": "container",
+        "query": "(min-width: 98.75em)",
+        "description": "Lower bound of the `content-full-width` breakpoint, evaluated against a marked container."
+      }
+    ],
+    "examples": [
+      "<div class=\"instui-hidden-max-sm\">Hidden at or below the small breakpoint.</div>\n<div class=\"instui-show-min-sm\">Shown only at or above the small breakpoint.</div>"
+    ],
+    "see": [],
+    "annotations": [],
+    "refs": [],
+    "decorators": [],
+    "compat": [],
+    "related": [],
+    "elements": {
+      "default": {
+        "any": true,
+        "allowed": [],
+        "include": [],
+        "exclude": [],
+        "groups": [],
+        "excludedGroups": []
+      },
+      "profiles": {}
+    },
+    "global": true,
+    "source": {
+      "line": 7501,
+      "column": 1
+    }
+  },
+  {
+    "name": "position",
+    "kind": "utility",
+    "className": ".--position-relative",
+    "summary": "`position` as a composable, global class — `.--position-<value>` — usable bare or chained onto any component (`.instui-button.--position-relative`).",
+    "modifiers": [
+      {
+        "name": "--position-absolute",
+        "prop": "",
+        "value": "position-absolute",
+        "description": "position: absolute."
+      },
+      {
+        "name": "--position-fixed",
+        "prop": "",
+        "value": "position-fixed",
+        "description": "position: fixed."
+      },
+      {
+        "name": "--position-relative",
+        "prop": "",
+        "value": "position-relative",
+        "description": "position: relative."
+      },
+      {
+        "name": "--position-static",
+        "prop": "",
+        "value": "position-static",
+        "description": "position: static."
+      },
+      {
+        "name": "--position-sticky",
+        "prop": "",
+        "value": "position-sticky",
+        "description": "position: sticky."
+      }
+    ],
+    "parts": [],
+    "shadowParts": [],
+    "pseudoElements": [],
+    "states": [],
+    "slots": [],
+    "todos": [],
+    "cssPropertiesConsumed": [],
+    "cssPropertiesDeclared": [],
+    "functions": [],
+    "animations": [],
+    "layers": [],
+    "conditions": [],
+    "examples": [
+      "<div class=\"--position-relative\">…</div>"
+    ],
+    "see": [],
+    "annotations": [],
+    "refs": [],
+    "decorators": [],
+    "compat": [],
+    "related": [],
+    "elements": {
+      "default": {
+        "any": true,
+        "allowed": [],
+        "include": [],
+        "exclude": [],
+        "groups": [],
+        "excludedGroups": []
+      },
+      "profiles": {}
+    },
+    "global": true,
+    "source": {
+      "line": 7756,
+      "column": 1
+    }
+  },
+  {
+    "name": "overflow",
+    "kind": "utility",
+    "className": ".--overflow-x-hidden",
+    "summary": "`overflow-x`/`overflow-y` as composable, global classes — `.--overflow-x-<value>` / `.--overflow-y-<value>` — usable bare or chained onto any component.",
+    "modifiers": [
+      {
+        "name": "--overflow-x-auto",
+        "prop": "",
+        "value": "overflow-x-auto",
+        "description": "overflow-x: auto."
+      },
+      {
+        "name": "--overflow-x-clip",
+        "prop": "",
+        "value": "overflow-x-clip",
+        "description": "overflow-x: clip."
+      },
+      {
+        "name": "--overflow-x-hidden",
+        "prop": "",
+        "value": "overflow-x-hidden",
+        "description": "overflow-x: hidden."
+      },
+      {
+        "name": "--overflow-x-scroll",
+        "prop": "",
+        "value": "overflow-x-scroll",
+        "description": "overflow-x: scroll."
+      },
+      {
+        "name": "--overflow-x-visible",
+        "prop": "",
+        "value": "overflow-x-visible",
+        "description": "overflow-x: visible."
+      },
+      {
+        "name": "--overflow-y-auto",
+        "prop": "",
+        "value": "overflow-y-auto",
+        "description": "overflow-y: auto."
+      },
+      {
+        "name": "--overflow-y-clip",
+        "prop": "",
+        "value": "overflow-y-clip",
+        "description": "overflow-y: clip."
+      },
+      {
+        "name": "--overflow-y-hidden",
+        "prop": "",
+        "value": "overflow-y-hidden",
+        "description": "overflow-y: hidden."
+      },
+      {
+        "name": "--overflow-y-scroll",
+        "prop": "",
+        "value": "overflow-y-scroll",
+        "description": "overflow-y: scroll."
+      },
+      {
+        "name": "--overflow-y-visible",
+        "prop": "",
+        "value": "overflow-y-visible",
+        "description": "overflow-y: visible."
+      }
+    ],
+    "parts": [],
+    "shadowParts": [],
+    "pseudoElements": [],
+    "states": [],
+    "slots": [],
+    "todos": [],
+    "cssPropertiesConsumed": [],
+    "cssPropertiesDeclared": [],
+    "functions": [],
+    "animations": [],
+    "layers": [],
+    "conditions": [],
+    "examples": [
+      "<div class=\"--overflow-y-auto\">…</div>"
+    ],
+    "see": [],
+    "annotations": [],
+    "refs": [],
+    "decorators": [],
+    "compat": [],
+    "related": [],
+    "elements": {
+      "default": {
+        "any": true,
+        "allowed": [],
+        "include": [],
+        "exclude": [],
+        "groups": [],
+        "excludedGroups": []
+      },
+      "profiles": {}
+    },
+    "global": true,
+    "source": {
+      "line": 7776,
+      "column": 1
+    }
+  },
+  {
+    "name": "cursor",
+    "kind": "utility",
+    "className": ".--cursor-pointer",
+    "summary": "`cursor` as a composable, global class — `.--cursor-<value>` — usable bare or chained onto any component (`.instui-button.--cursor-pointer`).",
+    "modifiers": [
+      {
+        "name": "--cursor-auto",
+        "prop": "",
+        "value": "cursor-auto",
+        "description": "cursor: auto."
+      },
+      {
+        "name": "--cursor-default",
+        "prop": "",
+        "value": "cursor-default",
+        "description": "cursor: default."
+      },
+      {
+        "name": "--cursor-grab",
+        "prop": "",
+        "value": "cursor-grab",
+        "description": "cursor: grab."
+      },
+      {
+        "name": "--cursor-move",
+        "prop": "",
+        "value": "cursor-move",
+        "description": "cursor: move."
+      },
+      {
+        "name": "--cursor-not-allowed",
+        "prop": "",
+        "value": "cursor-not-allowed",
+        "description": "cursor: not-allowed."
+      },
+      {
+        "name": "--cursor-pointer",
+        "prop": "",
+        "value": "cursor-pointer",
+        "description": "cursor: pointer."
+      },
+      {
+        "name": "--cursor-text",
+        "prop": "",
+        "value": "cursor-text",
+        "description": "cursor: text."
+      },
+      {
+        "name": "--cursor-wait",
+        "prop": "",
+        "value": "cursor-wait",
+        "description": "cursor: wait."
+      }
+    ],
+    "parts": [],
+    "shadowParts": [],
+    "pseudoElements": [],
+    "states": [],
+    "slots": [],
+    "todos": [],
+    "cssPropertiesConsumed": [],
+    "cssPropertiesDeclared": [],
+    "functions": [],
+    "animations": [],
+    "layers": [],
+    "conditions": [],
+    "examples": [
+      "<div class=\"--cursor-pointer\">…</div>"
+    ],
+    "see": [],
+    "annotations": [],
+    "refs": [],
+    "decorators": [],
+    "compat": [],
+    "related": [],
+    "elements": {
+      "default": {
+        "any": true,
+        "allowed": [],
+        "include": [],
+        "exclude": [],
+        "groups": [],
+        "excludedGroups": []
+      },
+      "profiles": {}
+    },
+    "global": true,
+    "source": {
+      "line": 7806,
+      "column": 1
+    }
+  },
+  {
+    "name": "stacking",
+    "kind": "utility",
+    "className": ".--stack-topmost",
+    "summary": "z-index depth utilities — `.--stack-<level>` (`deepest`, `below`, `above`, `topmost`) — usable bare or chained onto any component, so layers stack predictably instead of by hand-tuned numbers.",
+    "modifiers": [
+      {
+        "name": "--stack-above",
+        "prop": "",
+        "value": "stack-above",
+        "description": "Above the default flow."
+      },
+      {
+        "name": "--stack-below",
+        "prop": "",
+        "value": "stack-below",
+        "description": "Below the default flow."
+      },
+      {
+        "name": "--stack-deepest",
+        "prop": "",
+        "value": "stack-deepest",
+        "description": "The lowest stacking depth."
+      },
+      {
+        "name": "--stack-topmost",
+        "prop": "",
+        "value": "stack-topmost",
+        "description": "The highest stacking depth (overlays, menus)."
+      }
+    ],
+    "parts": [],
+    "shadowParts": [],
+    "pseudoElements": [],
+    "states": [],
+    "slots": [],
+    "todos": [],
+    "cssPropertiesConsumed": [
+      {
+        "name": "--instui-component-view-stacking-above"
+      },
+      {
+        "name": "--instui-component-view-stacking-below"
+      },
+      {
+        "name": "--instui-component-view-stacking-deepest"
+      },
+      {
+        "name": "--instui-component-view-stacking-topmost"
+      }
+    ],
+    "cssPropertiesDeclared": [],
+    "functions": [],
+    "animations": [],
+    "layers": [],
+    "conditions": [],
+    "examples": [
+      "<div class=\"--stack-topmost\">Always on top.</div>"
+    ],
+    "see": [],
+    "annotations": [],
+    "refs": [],
+    "decorators": [],
+    "compat": [],
+    "related": [],
+    "elements": {
+      "default": {
+        "any": true,
+        "allowed": [],
+        "include": [],
+        "exclude": [],
+        "groups": [],
+        "excludedGroups": []
+      },
+      "profiles": {}
+    },
+    "global": true,
+    "source": {
+      "line": 7832,
+      "column": 1
+    }
+  },
+  {
+    "name": "maskglobal",
+    "kind": "utility",
+    "className": ".--mask-overlay",
+    "summary": "A global, dual copy of the `mask` component's overlay modifiers — `--mask-overlay`, `--mask-fullscreen`, `--mask-blur` — usable bare or chained onto any component, without wrapping in a `.instui-mask` element.",
+    "modifiers": [
+      {
+        "name": "--mask-blur",
+        "prop": "",
+        "value": "mask-blur",
+        "description": "Blur what's behind the mask with a backdrop-filter."
+      },
+      {
+        "name": "--mask-fullscreen",
+        "prop": "",
+        "value": "mask-fullscreen",
+        "description": "Fixed to the viewport, covering it at a high z-index."
+      },
+      {
+        "name": "--mask-overlay",
+        "prop": "",
+        "value": "mask-overlay",
+        "description": "The full mask overlay (position, centring, background)."
+      }
+    ],
+    "parts": [],
+    "shadowParts": [],
+    "pseudoElements": [],
+    "states": [],
+    "slots": [],
+    "todos": [],
+    "cssPropertiesConsumed": [
+      {
+        "name": "--instui-component-mask-background-color"
+      }
+    ],
+    "cssPropertiesDeclared": [],
+    "functions": [],
+    "animations": [],
+    "layers": [],
+    "conditions": [],
+    "examples": [
+      "<button class=\"instui-button --mask-overlay\">…</button>"
+    ],
+    "see": [],
+    "annotations": [],
+    "refs": [],
+    "decorators": [],
+    "compat": [],
+    "related": [],
+    "elements": {
+      "default": {
+        "any": true,
+        "allowed": [],
+        "include": [],
+        "exclude": [],
+        "groups": [],
+        "excludedGroups": []
+      },
+      "profiles": {}
+    },
+    "global": true,
+    "source": {
+      "line": 7850,
+      "column": 1
+    }
+  },
+  {
+    "name": "transition",
+    "kind": "utility",
+    "className": ".instui-transition.-transition-fade-entering",
+    "summary": "Animation state classes for the `Transition` component — `.instui-transition` and state classes (`-transition-fade-entering`, `-transition-scale-exited`, etc.) — usable bare or chained onto any component.",
+    "modifiers": [
+      {
+        "name": "-transition-*",
+        "prop": "transition",
+        "pattern": true,
+        "description": "Transition type/state class toggled by runtime (`fade|scale|slide-*` + `entering|entered|exiting|exited`)."
+      },
+      {
+        "name": "-transition-fade-entered",
+        "prop": "transition",
+        "value": "fade-entered"
+      },
+      {
+        "name": "-transition-fade-entering",
+        "prop": "transition",
+        "value": "fade-entering"
+      },
+      {
+        "name": "-transition-fade-exited",
+        "prop": "transition",
+        "value": "fade-exited"
+      },
+      {
+        "name": "-transition-fade-exiting",
+        "prop": "transition",
+        "value": "fade-exiting"
+      },
+      {
+        "name": "-transition-scale-entered",
+        "prop": "transition",
+        "value": "scale-entered"
+      },
+      {
+        "name": "-transition-scale-entering",
+        "prop": "transition",
+        "value": "scale-entering"
+      },
+      {
+        "name": "-transition-scale-exited",
+        "prop": "transition",
+        "value": "scale-exited"
+      },
+      {
+        "name": "-transition-scale-exiting",
+        "prop": "transition",
+        "value": "scale-exiting"
+      },
+      {
+        "name": "-transition-slide-down-entered",
+        "prop": "transition",
+        "value": "slide-down-entered"
+      },
+      {
+        "name": "-transition-slide-down-entering",
+        "prop": "transition",
+        "value": "slide-down-entering"
+      },
+      {
+        "name": "-transition-slide-down-exited",
+        "prop": "transition",
+        "value": "slide-down-exited"
+      },
+      {
+        "name": "-transition-slide-down-exiting",
+        "prop": "transition",
+        "value": "slide-down-exiting"
+      },
+      {
+        "name": "-transition-slide-left-entered",
+        "prop": "transition",
+        "value": "slide-left-entered"
+      },
+      {
+        "name": "-transition-slide-left-entering",
+        "prop": "transition",
+        "value": "slide-left-entering"
+      },
+      {
+        "name": "-transition-slide-left-exited",
+        "prop": "transition",
+        "value": "slide-left-exited"
+      },
+      {
+        "name": "-transition-slide-left-exiting",
+        "prop": "transition",
+        "value": "slide-left-exiting"
+      },
+      {
+        "name": "-transition-slide-right-entered",
+        "prop": "transition",
+        "value": "slide-right-entered"
+      },
+      {
+        "name": "-transition-slide-right-entering",
+        "prop": "transition",
+        "value": "slide-right-entering"
+      },
+      {
+        "name": "-transition-slide-right-exited",
+        "prop": "transition",
+        "value": "slide-right-exited"
+      },
+      {
+        "name": "-transition-slide-right-exiting",
+        "prop": "transition",
+        "value": "slide-right-exiting"
+      },
+      {
+        "name": "-transition-slide-up-entered",
+        "prop": "transition",
+        "value": "slide-up-entered"
+      },
+      {
+        "name": "-transition-slide-up-entering",
+        "prop": "transition",
+        "value": "slide-up-entering"
+      },
+      {
+        "name": "-transition-slide-up-exited",
+        "prop": "transition",
+        "value": "slide-up-exited"
+      },
+      {
+        "name": "-transition-slide-up-exiting",
+        "prop": "transition",
+        "value": "slide-up-exiting"
+      }
+    ],
+    "parts": [],
+    "shadowParts": [],
+    "pseudoElements": [],
+    "states": [],
+    "slots": [],
+    "todos": [],
+    "cssPropertiesConsumed": [
+      {
+        "name": "--duration"
+      },
+      {
+        "name": "--timing"
+      }
+    ],
+    "cssPropertiesDeclared": [
+      {
+        "name": "--duration",
+        "syntax": "<time>",
+        "inherits": true,
+        "defaultValue": "300ms",
+        "description": "Animation duration (default `300ms`); override to speed up or slow down every transition state."
+      },
+      {
+        "name": "--timing",
+        "syntax": "*",
+        "inherits": true,
+        "defaultValue": "ease-in-out",
+        "description": "Animation timing function (default `ease-in-out`)."
+      }
+    ],
+    "functions": [],
+    "animations": [],
+    "layers": [],
+    "conditions": [],
+    "examples": [
+      "<div class=\"instui-transition -transition-fade-entering\">Animated content</div>"
+    ],
+    "see": [],
+    "annotations": [],
+    "refs": [],
+    "decorators": [],
+    "compat": [],
+    "related": [],
+    "elements": {
+      "default": {
+        "any": true,
+        "allowed": [],
+        "include": [],
+        "exclude": [],
+        "groups": [],
+        "excludedGroups": []
+      },
+      "profiles": {}
+    },
+    "global": true,
+    "source": {
+      "line": 7866,
+      "column": 1
+    }
+  },
+  {
+    "name": "truncate",
+    "kind": "utility",
+    "className": ".--truncate",
+    "summary": "Ellipsis truncation with line clamping controlled by `--lines` — usable bare or chained onto any component (`.instui-button.--truncate`).",
+    "remarks": "The base class uses `display: -webkit-box` and reads the `--lines` custom property to clamp text to a fixed number of lines before it ends in an ellipsis.",
+    "modifiers": [
+      {
+        "name": "--lines-1",
+        "prop": "",
+        "value": "lines-1",
+        "description": "Alias of `--max-lines-1`."
+      },
+      {
+        "name": "--lines-2",
+        "prop": "",
+        "value": "lines-2",
+        "description": "Alias of `--max-lines-2`."
+      },
+      {
+        "name": "--lines-3",
+        "prop": "",
+        "value": "lines-3",
+        "description": "Alias of `--max-lines-3`."
+      },
+      {
+        "name": "--lines-4",
+        "prop": "",
+        "value": "lines-4",
+        "description": "Alias of `--max-lines-4`."
+      },
+      {
+        "name": "--lines-5",
+        "prop": "",
+        "value": "lines-5",
+        "description": "Alias of `--max-lines-5`."
+      },
+      {
+        "name": "--max-lines-1",
+        "prop": "",
+        "value": "max-lines-1",
+        "description": "Clamp to one line (default)."
+      },
+      {
+        "name": "--max-lines-2",
+        "prop": "",
+        "value": "max-lines-2",
+        "description": "Clamp to two lines."
+      },
+      {
+        "name": "--max-lines-3",
+        "prop": "",
+        "value": "max-lines-3",
+        "description": "Clamp to three lines."
+      },
+      {
+        "name": "--max-lines-4",
+        "prop": "",
+        "value": "max-lines-4",
+        "description": "Clamp to four lines."
+      },
+      {
+        "name": "--max-lines-5",
+        "prop": "",
+        "value": "max-lines-5",
+        "description": "Clamp to five lines."
+      },
+      {
+        "name": "--max-lines-auto",
+        "prop": "",
+        "value": "max-lines-auto",
+        "description": "— Clamp to the number of lines that fit in the container, based on its height and the line height of the text.",
+        "interaction": true
+      },
+      {
+        "name": "--truncate",
+        "prop": "",
+        "value": "truncate",
+        "description": "Enables truncation and line clamping on the target element."
+      },
+      {
+        "name": "--truncate-character",
+        "prop": "",
+        "value": "truncate-character",
+        "description": "(default) Truncate at the character level."
+      },
+      {
+        "name": "--truncate-word",
+        "prop": "",
+        "value": "truncate-word",
+        "description": "Truncate at the word level."
+      }
+    ],
+    "parts": [],
+    "shadowParts": [],
+    "pseudoElements": [],
+    "states": [],
+    "slots": [],
+    "todos": [],
+    "cssPropertiesConsumed": [
+      {
+        "name": "--ellipsis"
+      },
+      {
+        "name": "--instui-component-truncate-text-font-family"
+      },
+      {
+        "name": "--instui-line-height-paragraph-base"
+      },
+      {
+        "name": "--lines"
+      }
+    ],
+    "cssPropertiesDeclared": [
+      {
+        "name": "--ellipsis",
+        "syntax": "clip | ellipsis | <string> | fade",
+        "inherits": false,
+        "defaultValue": "ellipsis"
+      },
+      {
+        "name": "--lines",
+        "syntax": "<integer>",
+        "inherits": false,
+        "defaultValue": "1"
+      }
+    ],
+    "functions": [],
+    "animations": [],
+    "layers": [],
+    "conditions": [],
+    "examples": [
+      "<div class=\"--truncate\">This text is clamped to one line by default and ends in an ellipsis.</div>\n<div class=\"--truncate\" style=\"--lines: 3\">This text is clamped to three lines and ends in an ellipsis.</div>\n<button class=\"instui-button --truncate\">…</button>"
+    ],
+    "see": [],
+    "annotations": [],
+    "refs": [],
+    "decorators": [],
+    "compat": [
+      "Clamping relies on `-webkit-line-clamp` with `display: -webkit-box`, paired with the standard `line-clamp`."
+    ],
+    "related": [
+      {
+        "name": "text",
+        "description": "Body typography that this truncates."
+      }
+    ],
+    "elements": {
+      "default": {
+        "any": true,
+        "allowed": [],
+        "include": [],
+        "exclude": [],
+        "groups": [],
+        "excludedGroups": []
+      },
+      "profiles": {}
+    },
+    "global": true,
+    "source": {
+      "line": 7959,
+      "column": 1
+    }
+  },
+  {
+    "name": "visual-debug",
+    "kind": "utility",
+    "className": ".-with-visual-debug",
+    "summary": "A layout-debugging outline: compound `.-with-visual-debug` onto any element to outline the box and its immediate children, so a layout's structure is visible at a glance.",
+    "modifiers": [],
+    "parts": [],
+    "shadowParts": [],
+    "pseudoElements": [],
+    "states": [],
+    "slots": [],
+    "todos": [],
+    "cssPropertiesConsumed": [
+      {
+        "name": "--pantoken-visual-debug-color"
+      }
+    ],
+    "cssPropertiesDeclared": [
+      {
+        "name": "--pantoken-visual-debug-color",
+        "description": "The outline colour (default a bright magenta); retint it to change every debug outline."
+      }
+    ],
+    "functions": [],
+    "animations": [],
+    "layers": [],
+    "conditions": [],
+    "examples": [
+      "<div class=\"instui-view -with-visual-debug\">\n  <span>Outlined child.</span>\n</div>"
+    ],
+    "see": [],
+    "annotations": [],
+    "refs": [],
+    "decorators": [],
+    "compat": [],
+    "related": [],
+    "elements": {
+      "default": {
+        "any": true,
+        "allowed": [],
+        "include": [],
+        "exclude": [],
+        "groups": [],
+        "excludedGroups": []
+      },
+      "profiles": {}
+    },
+    "global": true,
+    "source": {
+      "line": 8030,
+      "column": 1
+    }
+  },
+  {
+    "name": "spacing",
+    "kind": "utility",
+    "className": ".--p-md",
+    "summary": "Margin and padding utilities — `.--m<side>-<step>` / `.--margin-<side>-<step>` and `.--p<side>-<step>` / `.--padding-<side>-<step>` on the spacing scale (sides `t`/`b`/`s`/`e`/`x`/`y` or none, spelled short or fully long — for example `--mb-sm` and `--margin-bottom-small` are the same rule; margin also takes `auto`). Usable bare or chained onto any component (for example `class=\"instui-view --mb-sm\"`).",
+    "modifiers": [
+      {
+        "name": "--p-md",
+        "prop": "",
+        "value": "p-md",
+        "description": "Applies medium padding on all sides."
+      },
+      {
+        "name": "--m*",
+        "prop": "-m",
+        "pattern": true,
+        "description": "Margin utilities across short, legacy-long, and fully long spellings."
+      },
+      {
+        "name": "--p*",
+        "prop": "-p",
+        "pattern": true,
+        "description": "Padding utilities across short, legacy-long, and fully long spellings."
+      }
+    ],
+    "parts": [],
+    "shadowParts": [],
+    "pseudoElements": [],
+    "states": [],
+    "slots": [],
+    "todos": [],
+    "cssPropertiesConsumed": [
+      {
+        "name": "--instui-component-shared-tokens-spacing-general-space-none"
+      },
+      {
+        "name": "--instui-spacing-space-lg"
+      },
+      {
+        "name": "--instui-spacing-space-md"
+      },
+      {
+        "name": "--instui-spacing-space-sm"
+      },
+      {
+        "name": "--instui-spacing-space-xl"
+      },
+      {
+        "name": "--instui-spacing-space-xs"
+      },
+      {
+        "name": "--instui-spacing-space2xl"
+      },
+      {
+        "name": "--instui-spacing-space2xs"
+      }
+    ],
+    "cssPropertiesDeclared": [],
+    "functions": [],
+    "animations": [],
+    "layers": [],
+    "conditions": [],
+    "examples": [
+      "<div class=\"--p-md --mt-lg\">Padded box with a large top margin.</div>"
+    ],
+    "demo": "self:spacing",
+    "see": [],
+    "annotations": [],
+    "refs": [],
+    "decorators": [],
+    "compat": [],
+    "related": [],
+    "elements": {
+      "default": {
+        "any": true,
+        "allowed": [],
+        "include": [],
+        "exclude": [],
+        "groups": [],
+        "excludedGroups": []
+      },
+      "profiles": {}
+    },
+    "global": true,
+    "source": {
+      "line": 8050,
+      "column": 1
+    }
+  },
+  {
+    "name": "gap",
+    "kind": "utility",
+    "className": ".--gap-md",
+    "summary": "Flex/grid `gap` utilities on the spacing scale, short (`--gap-sm`) or long (`--gap-small`) spelling. Usable bare or chained onto any component (`.instui-view.--gap-sm`) — components that already set their own `gap` from a component-specific token may have it overridden.",
+    "modifiers": [
+      {
+        "name": "--gap-md",
+        "prop": "",
+        "value": "gap-md",
+        "description": "Applies the medium spacing token as the gap."
+      },
+      {
+        "name": "--gap-*",
+        "prop": "-gap",
+        "pattern": true,
+        "description": "Gap utilities across short and long spacing-step spellings."
+      }
+    ],
+    "parts": [],
+    "shadowParts": [],
+    "pseudoElements": [],
+    "states": [],
+    "slots": [],
+    "todos": [],
+    "cssPropertiesConsumed": [
+      {
+        "name": "--instui-component-shared-tokens-spacing-general-space-none"
+      },
+      {
+        "name": "--instui-spacing-space-lg"
+      },
+      {
+        "name": "--instui-spacing-space-md"
+      },
+      {
+        "name": "--instui-spacing-space-sm"
+      },
+      {
+        "name": "--instui-spacing-space-xl"
+      },
+      {
+        "name": "--instui-spacing-space-xs"
+      },
+      {
+        "name": "--instui-spacing-space2xl"
+      },
+      {
+        "name": "--instui-spacing-space2xs"
+      }
+    ],
+    "cssPropertiesDeclared": [],
+    "functions": [],
+    "animations": [],
+    "layers": [],
+    "conditions": [],
+    "examples": [
+      "<div class=\"--display-flex --gap-sm\">\n  <span>One</span>\n  <span>Two</span>\n</div>"
+    ],
+    "demo": "self:gap",
+    "see": [],
+    "annotations": [],
+    "refs": [],
+    "decorators": [],
+    "compat": [],
+    "related": [],
+    "elements": {
+      "default": {
+        "any": true,
+        "allowed": [],
+        "include": [],
+        "exclude": [],
+        "groups": [],
+        "excludedGroups": []
+      },
+      "profiles": {}
+    },
+    "global": true,
+    "source": {
+      "line": 8449,
+      "column": 1
+    }
+  },
+  {
+    "name": "color",
+    "kind": "utility",
+    "className": ".--text-danger",
+    "summary": "Semantic colour utilities: `.--bg-<name>`, `.--text-<name>` (aliased as `.--color-<name>`), and `.--border-<name>` for the curated semantic palette. Every one of these also has a component-attached alias modifier (for example `-bg-danger` on any `.instui-<component>`).",
+    "modifiers": [
+      {
+        "name": "--text-danger",
+        "prop": "",
+        "value": "text-danger",
+        "description": "Applies the semantic danger text colour."
+      },
+      {
+        "name": "--bg-*",
+        "prop": "-bg",
+        "pattern": true,
+        "description": "Background colour utilities for semantic and component-aligned names."
+      },
+      {
+        "name": "--border-*",
+        "prop": "-border",
+        "pattern": true,
+        "description": "Border colour utilities for semantic and component-aligned names."
+      },
+      {
+        "name": "--color-*",
+        "prop": "-color",
+        "pattern": true,
+        "description": "Alias of `--text-*` for text colour utilities."
+      },
+      {
+        "name": "--text-*",
+        "prop": "-text",
+        "pattern": true,
+        "description": "Text colour utilities for semantic and component-aligned names."
+      }
+    ],
+    "parts": [],
+    "shadowParts": [],
+    "pseudoElements": [],
+    "states": [],
+    "slots": [],
+    "todos": [],
+    "cssPropertiesConsumed": [
+      {
+        "name": "--instui-border-radius-container-lg"
+      },
+      {
+        "name": "--instui-border-radius-container-md"
+      },
+      {
+        "name": "--instui-border-radius-container-sm"
+      },
+      {
+        "name": "--instui-border-radius-container-xl"
+      },
+      {
+        "name": "--instui-border-radius-full"
+      },
+      {
+        "name": "--instui-border-radius-interactive-base"
+      },
+      {
+        "name": "--instui-border-radius-lg"
+      },
+      {
+        "name": "--instui-border-radius-md"
+      },
+      {
+        "name": "--instui-border-radius-sm"
+      },
+      {
+        "name": "--instui-border-radius-xl"
+      },
+      {
+        "name": "--instui-border-radius-xs"
+      },
+      {
+        "name": "--instui-border-radius-xxl"
+      },
+      {
+        "name": "--instui-border-width-interactive-base"
+      },
+      {
+        "name": "--instui-border-width-interactive-focus"
+      },
+      {
+        "name": "--instui-border-width-lg"
+      },
+      {
+        "name": "--instui-border-width-md"
+      },
+      {
+        "name": "--instui-border-width-sm"
+      },
+      {
+        "name": "--instui-color-background-accent-ash"
+      },
+      {
+        "name": "--instui-color-background-accent-aurora"
+      },
+      {
+        "name": "--instui-color-background-accent-blue"
+      },
+      {
+        "name": "--instui-color-background-accent-green"
+      },
+      {
+        "name": "--instui-color-background-accent-grey"
+      },
+      {
+        "name": "--instui-color-background-accent-honey"
+      },
+      {
+        "name": "--instui-color-background-accent-orange"
+      },
+      {
+        "name": "--instui-color-background-accent-plum"
+      },
+      {
+        "name": "--instui-color-background-accent-red"
+      },
+      {
+        "name": "--instui-color-background-accent-sea"
+      },
+      {
+        "name": "--instui-color-background-accent-sky"
+      },
+      {
+        "name": "--instui-color-background-accent-stone"
+      },
+      {
+        "name": "--instui-color-background-accent-violet"
+      },
+      {
+        "name": "--instui-color-background-base"
+      },
+      {
+        "name": "--instui-color-background-brand"
+      },
+      {
+        "name": "--instui-color-background-container"
+      },
+      {
+        "name": "--instui-color-background-dark"
+      },
+      {
+        "name": "--instui-color-background-error"
+      },
+      {
+        "name": "--instui-color-background-info"
+      },
+      {
+        "name": "--instui-color-background-inverse"
+      },
+      {
+        "name": "--instui-color-background-muted"
+      },
+      {
+        "name": "--instui-color-background-on-color"
+      },
+      {
+        "name": "--instui-color-background-page"
+      },
+      {
+        "name": "--instui-color-background-success"
+      },
+      {
+        "name": "--instui-color-background-warning"
+      },
+      {
+        "name": "--instui-color-institutional-brand-font-color-dark"
+      },
+      {
+        "name": "--instui-color-institutional-brand-primary"
+      },
+      {
+        "name": "--instui-color-stroke-accent-ash"
+      },
+      {
+        "name": "--instui-color-stroke-accent-aurora"
+      },
+      {
+        "name": "--instui-color-stroke-accent-blue"
+      },
+      {
+        "name": "--instui-color-stroke-accent-green"
+      },
+      {
+        "name": "--instui-color-stroke-accent-grey"
+      },
+      {
+        "name": "--instui-color-stroke-accent-honey"
+      },
+      {
+        "name": "--instui-color-stroke-accent-orange"
+      },
+      {
+        "name": "--instui-color-stroke-accent-plum"
+      },
+      {
+        "name": "--instui-color-stroke-accent-red"
+      },
+      {
+        "name": "--instui-color-stroke-accent-sea"
+      },
+      {
+        "name": "--instui-color-stroke-accent-sky"
+      },
+      {
+        "name": "--instui-color-stroke-accent-stone"
+      },
+      {
+        "name": "--instui-color-stroke-accent-violet"
+      },
+      {
+        "name": "--instui-color-stroke-base"
+      },
+      {
+        "name": "--instui-color-stroke-brand"
+      },
+      {
+        "name": "--instui-color-stroke-container-base"
+      },
+      {
+        "name": "--instui-color-stroke-container-dark"
+      },
+      {
+        "name": "--instui-color-stroke-error"
+      },
+      {
+        "name": "--instui-color-stroke-info"
+      },
+      {
+        "name": "--instui-color-stroke-inverse"
+      },
+      {
+        "name": "--instui-color-stroke-muted"
+      },
+      {
+        "name": "--instui-color-stroke-on-color"
+      },
+      {
+        "name": "--instui-color-stroke-strong"
+      },
+      {
+        "name": "--instui-color-stroke-success"
+      },
+      {
+        "name": "--instui-color-stroke-warning"
+      },
+      {
+        "name": "--instui-color-text-accent-ash"
+      },
+      {
+        "name": "--instui-color-text-accent-aurora"
+      },
+      {
+        "name": "--instui-color-text-accent-blue"
+      },
+      {
+        "name": "--instui-color-text-accent-green"
+      },
+      {
+        "name": "--instui-color-text-accent-grey"
+      },
+      {
+        "name": "--instui-color-text-accent-honey"
+      },
+      {
+        "name": "--instui-color-text-accent-orange"
+      },
+      {
+        "name": "--instui-color-text-accent-plum"
+      },
+      {
+        "name": "--instui-color-text-accent-red"
+      },
+      {
+        "name": "--instui-color-text-accent-sea"
+      },
+      {
+        "name": "--instui-color-text-accent-sky"
+      },
+      {
+        "name": "--instui-color-text-accent-stone"
+      },
+      {
+        "name": "--instui-color-text-accent-violet"
+      },
+      {
+        "name": "--instui-color-text-base"
+      },
+      {
+        "name": "--instui-color-text-dark"
+      },
+      {
+        "name": "--instui-color-text-error"
+      },
+      {
+        "name": "--instui-color-text-info"
+      },
+      {
+        "name": "--instui-color-text-inverse"
+      },
+      {
+        "name": "--instui-color-text-muted"
+      },
+      {
+        "name": "--instui-color-text-on-color"
+      },
+      {
+        "name": "--instui-color-text-success"
+      },
+      {
+        "name": "--instui-color-text-warning"
+      },
+      {
+        "name": "--instui-component-text-ai-background-color"
+      },
+      {
+        "name": "--instui-component-text-ai-color"
+      },
+      {
+        "name": "--instui-component-text-base-on-color"
+      },
+      {
+        "name": "--instui-component-text-content-font-size"
+      },
+      {
+        "name": "--instui-component-text-content-font-weight"
+      },
+      {
+        "name": "--instui-component-text-content-important-font-size"
+      },
+      {
+        "name": "--instui-component-text-content-important-font-weight"
+      },
+      {
+        "name": "--instui-component-text-content-important-line-height"
+      },
+      {
+        "name": "--instui-component-text-content-line-height"
+      },
+      {
+        "name": "--instui-component-text-content-quote-font-size"
+      },
+      {
+        "name": "--instui-component-text-content-quote-font-style"
+      },
+      {
+        "name": "--instui-component-text-content-quote-font-weight"
+      },
+      {
+        "name": "--instui-component-text-content-quote-line-height"
+      },
+      {
+        "name": "--instui-component-text-content-small-font-size"
+      },
+      {
+        "name": "--instui-component-text-content-small-font-weight"
+      },
+      {
+        "name": "--instui-component-text-content-small-line-height"
+      },
+      {
+        "name": "--instui-component-text-description-page-font-size"
+      },
+      {
+        "name": "--instui-component-text-description-page-font-weight"
+      },
+      {
+        "name": "--instui-component-text-description-page-line-height"
+      },
+      {
+        "name": "--instui-component-text-description-section-font-size"
+      },
+      {
+        "name": "--instui-component-text-description-section-font-weight"
+      },
+      {
+        "name": "--instui-component-text-description-section-line-height"
+      },
+      {
+        "name": "--instui-component-text-error-color"
+      },
+      {
+        "name": "--instui-component-text-inverse-color"
+      },
+      {
+        "name": "--instui-component-text-legend-font-size"
+      },
+      {
+        "name": "--instui-component-text-legend-font-weight"
+      },
+      {
+        "name": "--instui-component-text-legend-line-height"
+      },
+      {
+        "name": "--instui-component-text-muted-color"
+      },
+      {
+        "name": "--instui-component-text-muted-on-color"
+      },
+      {
+        "name": "--instui-component-text-primary-color"
+      },
+      {
+        "name": "--instui-component-view-background-alert"
+      },
+      {
+        "name": "--instui-component-view-background-danger"
+      },
+      {
+        "name": "--instui-component-view-background-primary"
+      },
+      {
+        "name": "--instui-component-view-background-primary-inverse"
+      },
+      {
+        "name": "--instui-component-view-background-secondary"
+      },
+      {
+        "name": "--instui-elevation-above"
+      },
+      {
+        "name": "--instui-elevation-card"
+      },
+      {
+        "name": "--instui-elevation-cardHover"
+      },
+      {
+        "name": "--instui-elevation-depth1"
+      },
+      {
+        "name": "--instui-elevation-depth2"
+      },
+      {
+        "name": "--instui-elevation-depth3"
+      },
+      {
+        "name": "--instui-elevation-resting"
+      },
+      {
+        "name": "--instui-elevation-topmost"
+      },
+      {
+        "name": "--instui-font-family-base"
+      },
+      {
+        "name": "--instui-font-family-code"
+      },
+      {
+        "name": "--instui-font-family-heading"
+      },
+      {
+        "name": "--instui-font-size-text-base"
+      },
+      {
+        "name": "--instui-font-size-text-lg"
+      },
+      {
+        "name": "--instui-font-size-text-sm"
+      },
+      {
+        "name": "--instui-font-size-text-xl"
+      },
+      {
+        "name": "--instui-font-size-text-xs"
+      },
+      {
+        "name": "--instui-font-size-text2xl"
+      },
+      {
+        "name": "--instui-font-weight-body-base"
+      },
+      {
+        "name": "--instui-font-weight-body-strong"
+      },
+      {
+        "name": "--instui-font-weight-heading-base"
+      },
+      {
+        "name": "--instui-font-weight-heading-strong"
+      },
+      {
+        "name": "--instui-font-weight-interactive"
+      },
+      {
+        "name": "--instui-line-height-heading-base"
+      },
+      {
+        "name": "--instui-line-height-heading-loose"
+      },
+      {
+        "name": "--instui-line-height-heading-text-lg"
+      },
+      {
+        "name": "--instui-line-height-heading-text-xl"
+      },
+      {
+        "name": "--instui-line-height-heading-text2xl"
+      },
+      {
+        "name": "--instui-line-height-heading-text3xl"
+      },
+      {
+        "name": "--instui-line-height-label-base"
+      },
+      {
+        "name": "--instui-line-height-paragraph-base"
+      },
+      {
+        "name": "--instui-line-height-paragraph-text-base"
+      },
+      {
+        "name": "--instui-line-height-paragraph-text-sm"
+      },
+      {
+        "name": "--instui-line-height-paragraph-text-xs"
+      },
+      {
+        "name": "--instui-line-height-standalone-base"
+      },
+      {
+        "name": "--instui-line-height-standalone-text-base"
+      },
+      {
+        "name": "--instui-line-height-standalone-text-lg"
+      },
+      {
+        "name": "--instui-line-height-standalone-text-sm"
+      },
+      {
+        "name": "--instui-line-height-standalone-text-xl"
+      },
+      {
+        "name": "--instui-line-height-standalone-text-xs"
+      },
+      {
+        "name": "--instui-line-height-standalone-text2xl"
+      },
+      {
+        "name": "--instui-line-height-standalone-text3xl"
+      },
+      {
+        "name": "--instui-line-height-standalone-text4xl"
+      },
+      {
+        "name": "--instui-opacity-base"
+      },
+      {
+        "name": "--instui-opacity-disabled"
+      }
+    ],
+    "cssPropertiesDeclared": [],
+    "functions": [],
+    "animations": [],
+    "layers": [],
+    "conditions": [],
+    "examples": [
+      "<p class=\"--text-danger\">Something went wrong.</p>"
+    ],
+    "see": [],
+    "annotations": [],
+    "refs": [],
+    "decorators": [],
+    "compat": [],
+    "related": [],
+    "elements": {
+      "default": {
+        "any": true,
+        "allowed": [],
+        "include": [],
+        "exclude": [],
+        "groups": [],
+        "excludedGroups": []
+      },
+      "profiles": {}
+    },
+    "global": true,
+    "source": {
+      "line": 8480,
       "column": 1
     }
   }