:root {
  --instui-stacking-deepest: -9999;
  --instui-stacking-below: -1;
  --instui-stacking-above: 1;
  --instui-stacking-topmost: 9999;
}
/**
 * @utility stacking
 * @class .instui-stack-topmost
 * @group Plugins
 * @summary z-index depth utilities: `.instui-stack-<level>` (`deepest`, `below`, `above`, `topmost`) set `z-index` from the `--instui-stacking-*` scale, so layers stack predictably instead of by hand-tuned numbers.
 * @cssproperty --instui-stacking-deepest — The lowest stacking depth.
 * @cssproperty --instui-stacking-below — Below the default flow.
 * @cssproperty --instui-stacking-above — Above the default flow.
 * @cssproperty --instui-stacking-topmost — The highest stacking depth (overlays, menus).
 * @example
 * <div class="instui-stack-topmost">Always on top.</div>
 */
@property --instui-stacking-deepest { syntax: "<integer>"; inherits: true; initial-value: -9999; }
@property --instui-stacking-below { syntax: "<integer>"; inherits: true; initial-value: -1; }
@property --instui-stacking-above { syntax: "<integer>"; inherits: true; initial-value: 1; }
@property --instui-stacking-topmost { syntax: "<integer>"; inherits: true; initial-value: 9999; }
.instui-stack-deepest { z-index: var(--instui-stacking-deepest); }
.instui-stack-below { z-index: var(--instui-stacking-below); }
.instui-stack-above { z-index: var(--instui-stacking-above); }
.instui-stack-topmost { z-index: var(--instui-stacking-topmost); }