@charset "utf-8";
@import (optional, reference) "var.less";
@media screen and (min-width: @ceil-xs) and (max-width: @ceil-sm) {
  :root {
    --_s-screen: xs;
  }
  [class*="_wrap"] {
    --_wrap-w-2:var(--_w-xs);
  }
  @media (orientation: landscape) {
    :root {
      --_fs-base: var(--_fs-phone);
    }
  /*   [class*="_wrap"] {
      --_wrap-w-1:var(--_w-xxs);
      --_wrap-w-2:var(--_w-xxs);
    } */
  }
  ._hide-xs {
    display: none;
  }
  ._grid[class*="_xs"] {
    --_share-avg: var(--_group);
  }
  .flex-res(xs);
  ._row:where([class*="_xs"]) {
    flex-wrap: wrap;
    &:is([class*="_avg-"])>*,
    >*:is([class*="_flex"], [class*="_own"]) {
      .gap-row(var(--_group));
    }
    >*:is([class*="_flex"]) {
      flex: none;
    }
  }
  ._col:where([class*="_xs"]) {
    flex-wrap: wrap;
    &:is([class*="_avg-"])>*,
    >*:is([class*="_flex"], [class*="_own-"]) {
      .gap-col(var(--_group));
    }
    >*:is([class*="_flex"]) {
      flex: none;
    }
  }
}
