/* Optional, finite utilities: no generator, JS runtime, resets or network assets.
   Load after syntyr.core.css, or use syntyr.all.css. */
@layer syn.utilities {
  .syn-root :where(.syn-u-flex) { display: flex; min-width: 0; }
  .syn-root :where(.syn-u-grid) { display: grid; min-width: 0; }
  .syn-root :where(.syn-u-stack) { display: grid; gap: var(--syn-space-2); min-width: 0; }
  .syn-root :where(.syn-u-inline) { display: flex; flex-wrap: wrap; align-items: center; gap: var(--syn-space-2); }
  .syn-root :where(.syn-u-center) { align-items: center; justify-content: center; }
  .syn-root :where(.syn-u-between) { justify-content: space-between; }
  .syn-root :where(.syn-u-gap-1) { gap: var(--syn-space-1); }
  .syn-root :where(.syn-u-gap-2) { gap: var(--syn-space-2); }
  .syn-root :where(.syn-u-gap-3) { gap: var(--syn-space-3); }
  .syn-root :where(.syn-u-p-1) { padding: var(--syn-space-1); }
  .syn-root :where(.syn-u-p-2) { padding: var(--syn-space-2); }
  .syn-root :where(.syn-u-p-3) { padding: var(--syn-space-3); }
  .syn-root :where(.syn-u-mt-1) { margin-block-start: var(--syn-space-1); }
  .syn-root :where(.syn-u-mt-2) { margin-block-start: var(--syn-space-2); }
  .syn-root :where(.syn-u-mt-3) { margin-block-start: var(--syn-space-3); }
  .syn-root :where(.syn-u-sr-only) {
    position: absolute; width: 1px; height: 1px; padding: 0;
    margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0);
    white-space: nowrap; border: 0;
  }
}