@layer reset, base, tokens, recipes, utilities;

@import './reset.css';

@import './global.css';

@import './tokens/index.css';

@import './tokens/keyframes.css';

@layer utilities {
  .pixel-fs_xl {
    font-size: var(--pixel-font-sizes-xl)
    }

  .pixel-font_bold {
    font-weight: var(--pixel-font-weights-bold)
    }

  .pixel-color-palette_green {
    --pixel-colors-color-palette-50: var(--pixel-colors-green-50);
    --pixel-colors-color-palette-100: var(--pixel-colors-green-100);
    --pixel-colors-color-palette-200: var(--pixel-colors-green-200);
    --pixel-colors-color-palette-300: var(--pixel-colors-green-300);
    --pixel-colors-color-palette-400: var(--pixel-colors-green-400);
    --pixel-colors-color-palette-500: var(--pixel-colors-green-500);
    --pixel-colors-color-palette-600: var(--pixel-colors-green-600);
    --pixel-colors-color-palette-700: var(--pixel-colors-green-700);
    --pixel-colors-color-palette-800: var(--pixel-colors-green-800);
    --pixel-colors-color-palette-900: var(--pixel-colors-green-900);
    --pixel-colors-color-palette-950: var(--pixel-colors-green-950)
    }

  .pixel-bg_red\.200 {
    background: var(--pixel-colors-red-200)
    }

  .pixel-border-width_1px {
    border-width: 1px
    }

  .pixel-border_red\.200 {
    border-color: var(--pixel-colors-red-200)
    }

  .pixel-p_4 {
    padding: var(--pixel-spacing-4)
    }

  .pixel-fs_12px {
    font-size: 12px
    }

  .pixel-p_8 {
    padding: var(--pixel-spacing-8)
    }

  .pixel-fs_24px {
    font-size: 24px
    }

  .pixel-leading_xs {
    line-height: xs
    }

  .pixel-leading_sm {
    line-height: sm
    }

  .pixel-leading_lg {
    line-height: lg
    }

  .pixel-leading_xl {
    line-height: xl
    }

  .pixel-text_white {
    color: var(--pixel-colors-white)
    }

  .pixel-text_uppercase {
    text-transform: uppercase
    }

  .pixel-select_none {
    -webkit-user-select: none;
    user-select: none
    }

  .pixel-bg_gray\.400 {
    background-color: var(--pixel-colors-gray-400)
    }

  .pixel-d_inline-flex {
    display: inline-flex
    }

  .pixel-items_center {
    align-items: center
    }

  .pixel-shrink_0 {
    flex-shrink: 0
    }

  .pixel-justify_center {
    justify-content: center
    }

  .pixel-pos_relative {
    position: relative
    }

  .pixel-font_semibold {
    font-weight: var(--pixel-font-weights-semibold)
    }

  .pixel-align_top {
    vertical-align: top
    }

  .pixel-bg_teal\.50 {
    background-color: var(--pixel-colors-teal-50)
    }

  .pixel-border-width_0\.5 {
    border-width: 0.5px
    }

  .pixel-border_pink\.400 {
    border-color: var(--pixel-colors-pink-400)
    }

  .pixel-rounded_full {
    border-radius: var(--pixel-radii-full)
    }

  .pixel-bg_gray\.50 {
    background-color: var(--pixel-colors-gray-50)
    }

  .pixel-bg_sky\.400 {
    background-color: var(--pixel-colors-sky-400)
    }

  .pixel-bg_teal\.400 {
    background-color: var(--pixel-colors-teal-400)
    }

  .pixel-bg_violet\.400 {
    background-color: var(--pixel-colors-violet-400)
    }

  .pixel-bg_amber\.400 {
    background-color: var(--pixel-colors-amber-400)
    }

  .pixel-bg_rose\.400 {
    background-color: var(--pixel-colors-rose-400)
    }

  .pixel-bg_stone\.400 {
    background-color: var(--pixel-colors-stone-400)
    }

  .pixel-bg_lime\.400 {
    background-color: var(--pixel-colors-lime-400)
    }

  .pixel-bg_pink\.400 {
    background-color: var(--pixel-colors-pink-400)
    }

  .pixel-w_6 {
    width: var(--pixel-sizes-6)
    }

  .pixel-h_6 {
    height: var(--pixel-sizes-6)
    }

  .pixel-fs_xs {
    font-size: var(--pixel-font-sizes-xs)
    }

  .pixel-w_8 {
    width: var(--pixel-sizes-8)
    }

  .pixel-h_8 {
    height: var(--pixel-sizes-8)
    }

  .pixel-fs_sm {
    font-size: var(--pixel-font-sizes-sm)
    }

  .pixel-w_12 {
    width: var(--pixel-sizes-12)
    }

  .pixel-h_12 {
    height: var(--pixel-sizes-12)
    }

  .pixel-fs_lg {
    font-size: var(--pixel-font-sizes-lg)
    }

  .pixel-w_20 {
    width: var(--pixel-sizes-20)
    }

  .pixel-h_20 {
    height: var(--pixel-sizes-20)
    }

  .pixel-fs_2xl {
    font-size: var(--pixel-font-sizes-2xl)
    }

  .pixel-border-width_0\.125rem {
    border-width: 0.125rem
    }

  .pixel-rounded_sm {
    border-radius: var(--pixel-radii-sm)
    }

  .pixel-rounded_md {
    border-radius: var(--pixel-radii-md)
    }

  .pixel-rounded_lg {
    border-radius: var(--pixel-radii-lg)
    }

  .pixel-rounded_xl {
    border-radius: var(--pixel-radii-xl)
    }

  .pixel-text_gray\.600 {
    color: var(--pixel-colors-gray-600)
    }
}