/*************************
######################
>>> TABLE OF CONTENTS:
######################

## Utilities
### Appearance
  * Background
    - colors
    - opacity
  * Border
    - colors
    - opacity
    - radius
    - width
  * Cursors
  * Text
    - colors
    - text opacity
    - text-*
  * Views
    - fade
    - shadow
    - opacity
  * Visibilities
    - invisible
    - visible

### Layout
  * Dimensions
    - height
    - width
    - scale
    - size
    - auto grow textarea
  * Displays
    - displays
    - flex-*
    - grid-*
    - overflow
    - flip
    - rotate
    - clearfix
  * Positions
    - float*
    - position*
    - inset*
    - top, right, bottom, left
    - align*
    - justify*
    - vertical*
    - stretch
    - Offset
    - Order
  * Spaces
    - gap
    - column gap
    - row gap
    - margin
    - padding
    - grid*
  * Index
  
### Typography & Font
  * Header
  * Subheader & Subtext
  * Drop caps (initial letter)
  * Font size, weight, style
  * Text align, transform, decoration, wrap, muted, truncate
  * Line height
  * Text wrap
    
### Interactions
  * pointer-events-none
  * txt-select-all
  * txt-select-auto
  * txt-select-none
  * overscroll-behavior-contain
  * lazy render
    
### @Container

### @Media screen
  
*************************/

@layer ui {
  /*
  ## Utilities
  */
  
  /*
  ### Appearance
  */
  
  /**************** Background ****************/
  .bg-none {
    background: none;
  }

  .bg-transparent {
    background: transparent;
  }

  /*** Background colors ***/
  .bg-white {background-color: white}

  .bg-accent {background-color: var(--accent-color); }

  .bg-base-5 {background-color: var(--color-base-5); }
  .bg-base-6 {background-color: var(--color-base-6); }
  .bg-base-7 {background-color: var(--color-base-7); }
  .bg-base-8 {background-color: var(--color-base-8); }
  .bg-base-9 {background-color: var(--color-base-9); }
  .bg-base-10 {background-color: var(--color-base-10); }
  .bg-base-20 {background-color: var(--color-base-20); }
  .bg-base-30 {background-color: var(--color-base-30); }
  .bg-base-40 {background-color: var(--color-base-40); }
  .bg-base-50 {background-color: var(--color-base-50); }
  .bg-base-60 {background-color: var(--color-base-60); }
  .bg-base-70 {background-color: var(--color-base-70); }
  .bg-base-80 {background-color: var(--color-base-80); }
  .bg-base-90 {background-color: var(--color-base-90); }

  .bg-low-5 {background-color: var(--color-low-5); }
  .bg-low-10 {background-color: var(--color-low-10); }
  .bg-low-20 {background-color: var(--color-low-20); }
  .bg-low-30 {background-color: var(--color-low-30); }
  .bg-low-40 {background-color: var(--color-low-40); }
  .bg-low-50 {background-color: var(--color-low-50); }
  .bg-low-60 {background-color: var(--color-low-60); }
  .bg-low-70 {background-color: var(--color-low-70); }
  .bg-low-80 {background-color: var(--color-low-80); }
  .bg-low-90 {background-color: var(--color-low-90); }

  .bg-normal-5 {background-color: var(--color-normal-5); }
  .bg-normal-10 {background-color: var(--color-normal-10); }
  .bg-normal-20 {background-color: var(--color-normal-20); }
  .bg-normal-30 {background-color: var(--color-normal-30); }
  .bg-normal-40 {background-color: var(--color-normal-40); }
  .bg-normal-50 {background-color: var(--color-normal-50); }
  .bg-normal-60 {background-color: var(--color-normal-60); }
  .bg-normal-70 {background-color: var(--color-normal-70); }
  .bg-normal-80 {background-color: var(--color-normal-80); }
  .bg-normal-90 {background-color: var(--color-normal-90); }

  .bg-important-5 {background-color: var(--color-important-5); }
  .bg-important-10 {background-color: var(--color-important-10); }
  .bg-important-20 {background-color: var(--color-important-20); }
  .bg-important-30 {background-color: var(--color-important-30); }
  .bg-important-40 {background-color: var(--color-important-40); }
  .bg-important-50 {background-color: var(--color-important-50); }
  .bg-important-60 {background-color: var(--color-important-60); }
  .bg-important-70 {background-color: var(--color-important-70); }
  .bg-important-80 {background-color: var(--color-important-80); }
  .bg-important-90 {background-color: var(--color-important-90); }

  .bg-critical-5 {background-color: var(--color-critical-5); }
  .bg-critical-10 {background-color: var(--color-critical-10); }
  .bg-critical-20 {background-color: var(--color-critical-20); }
  .bg-critical-30 {background-color: var(--color-critical-30); }
  .bg-critical-40 {background-color: var(--color-critical-40); }
  .bg-critical-50 {background-color: var(--color-critical-50); }
  .bg-critical-60 {background-color: var(--color-critical-60); }
  .bg-critical-70 {background-color: var(--color-critical-70); }
  .bg-critical-80 {background-color: var(--color-critical-80); }
  .bg-critical-90 {background-color: var(--color-critical-90); }

  .bg-success-5 {background-color: var(--color-success-5); }
  .bg-success-10 {background-color: var(--color-success-10); }
  .bg-success-20 {background-color: var(--color-success-20); }
  .bg-success-30 {background-color: var(--color-success-30); }
  .bg-success-40 {background-color: var(--color-success-40); }
  .bg-success-50 {background-color: var(--color-success-50); }
  .bg-success-60 {background-color: var(--color-success-60); }
  .bg-success-70 {background-color: var(--color-success-70); }
  .bg-success-80 {background-color: var(--color-success-80); }
  .bg-success-90 {background-color: var(--color-success-90); }

  .bg-info-5 {background-color: var(--color-info-5); }
  .bg-info-10 {background-color: var(--color-info-10); }
  .bg-info-20 {background-color: var(--color-info-20); }
  .bg-info-30 {background-color: var(--color-info-30); }
  .bg-info-40 {background-color: var(--color-info-40); }
  .bg-info-50 {background-color: var(--color-info-50); }
  .bg-info-60 {background-color: var(--color-info-60); }
  .bg-info-70 {background-color: var(--color-info-70); }
  .bg-info-80 {background-color: var(--color-info-80); }
  .bg-info-90 {background-color: var(--color-info-90); }

  .bg-caution-5 {background-color: var(--color-caution-5); }
  .bg-caution-10 {background-color: var(--color-caution-10); }
  .bg-caution-20 {background-color: var(--color-caution-20); }
  .bg-caution-30 {background-color: var(--color-caution-30); }
  .bg-caution-40 {background-color: var(--color-caution-40); }
  .bg-caution-50 {background-color: var(--color-caution-50); }
  .bg-caution-60 {background-color: var(--color-caution-60); }
  .bg-caution-70 {background-color: var(--color-caution-70); }
  .bg-caution-80 {background-color: var(--color-caution-80); }
  .bg-caution-90 {background-color: var(--color-caution-90); }

  .bg-warning-5 {background-color: var(--color-warning-5); }
  .bg-warning-10 {background-color: var(--color-warning-10); }
  .bg-warning-20 {background-color: var(--color-warning-20); }
  .bg-warning-30 {background-color: var(--color-warning-30); }
  .bg-warning-40 {background-color: var(--color-warning-40); }
  .bg-warning-50 {background-color: var(--color-warning-50); }
  .bg-warning-60 {background-color: var(--color-warning-60); }
  .bg-warning-70 {background-color: var(--color-warning-70); }
  .bg-warning-80 {background-color: var(--color-warning-80); }
  .bg-warning-90 {background-color: var(--color-warning-90); }

  .bg-error-5 {background-color: var(--color-error-5); }
  .bg-error-10 {background-color: var(--color-error-10); }
  .bg-error-20 {background-color: var(--color-error-20); }
  .bg-error-30 {background-color: var(--color-error-30); }
  .bg-error-40 {background-color: var(--color-error-40); }
  .bg-error-50 {background-color: var(--color-error-50); }
  .bg-error-60 {background-color: var(--color-error-60); }
  .bg-error-70 {background-color: var(--color-error-70); }
  .bg-error-80 {background-color: var(--color-error-80); }
  .bg-error-90 {background-color: var(--color-error-90); }

  .bg-danger-5 {background-color: var(--color-danger-5); }
  .bg-danger-10 {background-color: var(--color-danger-10); }
  .bg-danger-20 {background-color: var(--color-danger-20); }
  .bg-danger-30 {background-color: var(--color-danger-30); }
  .bg-danger-40 {background-color: var(--color-danger-40); }
  .bg-danger-50 {background-color: var(--color-danger-50); }
  .bg-danger-60 {background-color: var(--color-danger-60); }
  .bg-danger-70 {background-color: var(--color-danger-70); }
  .bg-danger-80 {background-color: var(--color-danger-80); }
  .bg-danger-90 {background-color: var(--color-danger-90); }

  /*** Background opacity ***/
  .bg-opacity-\.25 {
    --bg-opacity: 0.25;
  }

  .bg-opacity-\.50 {
    --bg-opacity: 0.5;
  }

  .bg-opacity-\.75 {
    --bg-opacity: 0.75;
  }

  .bg-opacity-1 {
    --bg-opacity: 1;
  }

  /**************** Border ****************/
  .border {
    border: 0 var(--controls--border-style) var(--controls--border-color, var(--border-color-control));
    border-width: var(--controls--border-width);
  }
  
  /**************** Border colors ****************/
  .border-color-unset {border-color: unset;}
  .border-color-base-5 {border-color: var(--color-base-5); }
  .border-color-base-6 {border-color: var(--color-base-6); }
  .border-color-base-7 {border-color: var(--color-base-7); }
  .border-color-base-8 {border-color: var(--color-base-8); }
  .border-color-base-9 {border-color: var(--color-base-9); }
  .border-color-base-10 {border-color: var(--color-base-10); }
  .border-color-base-20 {border-color: var(--color-base-20); }
  .border-color-base-30 {border-color: var(--color-base-30); }
  .border-color-base-40 {border-color: var(--color-base-40); }
  .border-color-base-50 {border-color: var(--color-base-50); }
  .border-color-base-60 {border-color: var(--color-base-60); }
  .border-color-base-70 {border-color: var(--color-base-70); }
  .border-color-base-80 {border-color: var(--color-base-80); }
  .border-color-base-90 {border-color: var(--color-base-90); }

  .border-color-low-5 {border-color: var(--color-low-5); }
  .border-color-low-10 {border-color: var(--color-low-10); }
  .border-color-low-20 {border-color: var(--color-low-20); }
  .border-color-low-30 {border-color: var(--color-low-30); }
  .border-color-low-40 {border-color: var(--color-low-40); }
  .border-color-low-50 {border-color: var(--color-low-50); }
  .border-color-low-60 {border-color: var(--color-low-60); }
  .border-color-low-70 {border-color: var(--color-low-70); }
  .border-color-low-80 {border-color: var(--color-low-80); }
  .border-color-low-90 {border-color: var(--color-low-90); }

  .border-color-normal-5 {border-color: var(--color-normal-5); }
  .border-color-normal-10 {border-color: var(--color-normal-10); }
  .border-color-normal-20 {border-color: var(--color-normal-20); }
  .border-color-normal-30 {border-color: var(--color-normal-30); }
  .border-color-normal-40 {border-color: var(--color-normal-40); }
  .border-color-normal-50 {border-color: var(--color-normal-50); }
  .border-color-normal-60 {border-color: var(--color-normal-60); }
  .border-color-normal-70 {border-color: var(--color-normal-70); }
  .border-color-normal-80 {border-color: var(--color-normal-80); }
  .border-color-normal-90 {border-color: var(--color-normal-90); }

  .border-color-important-5 {border-color: var(--color-important-5); }
  .border-color-important-10 {border-color: var(--color-important-10); }
  .border-color-important-20 {border-color: var(--color-important-20); }
  .border-color-important-30 {border-color: var(--color-important-30); }
  .border-color-important-40 {border-color: var(--color-important-40); }
  .border-color-important-50 {border-color: var(--color-important-50); }
  .border-color-important-60 {border-color: var(--color-important-60); }
  .border-color-important-70 {border-color: var(--color-important-70); }
  .border-color-important-80 {border-color: var(--color-important-80); }
  .border-color-important-90 {border-color: var(--color-important-90); }

  .border-color-critical-5 {border-color: var(--color-critical-5); }
  .border-color-critical-10 {border-color: var(--color-critical-10); }
  .border-color-critical-20 {border-color: var(--color-critical-20); }
  .border-color-critical-30 {border-color: var(--color-critical-30); }
  .border-color-critical-40 {border-color: var(--color-critical-40); }
  .border-color-critical-50 {border-color: var(--color-critical-50); }
  .border-color-critical-60 {border-color: var(--color-critical-60); }
  .border-color-critical-70 {border-color: var(--color-critical-70); }
  .border-color-critical-80 {border-color: var(--color-critical-80); }
  .border-color-critical-90 {border-color: var(--color-critical-90); }

  .border-color-success-5 {border-color: var(--color-success-5); }
  .border-color-success-10 {border-color: var(--color-success-10); }
  .border-color-success-20 {border-color: var(--color-success-20); }
  .border-color-success-30 {border-color: var(--color-success-30); }
  .border-color-success-40 {border-color: var(--color-success-40); }
  .border-color-success-50 {border-color: var(--color-success-50); }
  .border-color-success-60 {border-color: var(--color-success-60); }
  .border-color-success-70 {border-color: var(--color-success-70); }
  .border-color-success-80 {border-color: var(--color-success-80); }
  .border-color-success-90 {border-color: var(--color-success-90); }

  .border-color-info-5 {border-color: var(--color-info-5); }
  .border-color-info-10 {border-color: var(--color-info-10); }
  .border-color-info-20 {border-color: var(--color-info-20); }
  .border-color-info-30 {border-color: var(--color-info-30); }
  .border-color-info-40 {border-color: var(--color-info-40); }
  .border-color-info-50 {border-color: var(--color-info-50); }
  .border-color-info-60 {border-color: var(--color-info-60); }
  .border-color-info-70 {border-color: var(--color-info-70); }
  .border-color-info-80 {border-color: var(--color-info-80); }
  .border-color-info-90 {border-color: var(--color-info-90); }

  .border-color-caution-5 {border-color: var(--color-caution-5); }
  .border-color-caution-10 {border-color: var(--color-caution-10); }
  .border-color-caution-20 {border-color: var(--color-caution-20); }
  .border-color-caution-30 {border-color: var(--color-caution-30); }
  .border-color-caution-40 {border-color: var(--color-caution-40); }
  .border-color-caution-50 {border-color: var(--color-caution-50); }
  .border-color-caution-60 {border-color: var(--color-caution-60); }
  .border-color-caution-70 {border-color: var(--color-caution-70); }
  .border-color-caution-80 {border-color: var(--color-caution-80); }
  .border-color-caution-90 {border-color: var(--color-caution-90); }

  .border-color-warning-5 {border-color: var(--color-warning-5); }
  .border-color-warning-10 {border-color: var(--color-warning-10); }
  .border-color-warning-20 {border-color: var(--color-warning-20); }
  .border-color-warning-30 {border-color: var(--color-warning-30); }
  .border-color-warning-40 {border-color: var(--color-warning-40); }
  .border-color-warning-50 {border-color: var(--color-warning-50); }
  .border-color-warning-60 {border-color: var(--color-warning-60); }
  .border-color-warning-70 {border-color: var(--color-warning-70); }
  .border-color-warning-80 {border-color: var(--color-warning-80); }
  .border-color-warning-90 {border-color: var(--color-warning-90); }

  .border-color-error-5 {border-color: var(--color-error-5); }
  .border-color-error-10 {border-color: var(--color-error-10); }
  .border-color-error-20 {border-color: var(--color-error-20); }
  .border-color-error-30 {border-color: var(--color-error-30); }
  .border-color-error-40 {border-color: var(--color-error-40); }
  .border-color-error-50 {border-color: var(--color-error-50); }
  .border-color-error-60 {border-color: var(--color-error-60); }
  .border-color-error-70 {border-color: var(--color-error-70); }
  .border-color-error-80 {border-color: var(--color-error-80); }
  .border-color-error-90 {border-color: var(--color-error-90); }

  .border-color-danger-5 {border-color: var(--color-danger-5); }
  .border-color-danger-10 {border-color: var(--color-danger-10); }
  .border-color-danger-20 {border-color: var(--color-danger-20); }
  .border-color-danger-30 {border-color: var(--color-danger-30); }
  .border-color-danger-40 {border-color: var(--color-danger-40); }
  .border-color-danger-50 {border-color: var(--color-danger-50); }
  .border-color-danger-60 {border-color: var(--color-danger-60); }
  .border-color-danger-70 {border-color: var(--color-danger-70); }
  .border-color-danger-80 {border-color: var(--color-danger-80); }
  .border-color-danger-90 {border-color: var(--color-danger-90); }


  /**************** Border opacity ****************/
  .border-opacity-\.25 {
    --border-opacity: 0.25;
  }

  .border-opacity-\.50 {
    --border-opacity: 0.5;
  }

  .border-opacity-\.75 {
    --border-opacity: 0.75;
  }

  .border-opacity-1 {
    --border-opacity: 1;
  }

  /**************** Border radius ****************/
  .borders-radius-unset {
    border-radius: unset;
  }
  .border-top-left-radius-unset {
    border-top-left-radius: unset;
  }
  .border-top-right-radius-unset {
    border-top-right-radius: unset;
  }
  .border-bottom-left-radius-unset {
    border-bottom-left-radius: unset;
  }
  .border-bottom-right-radius-unset {
    border-bottom-right-radius: unset;
  }

  .borders-radius-\.25 {
    border-radius: .25rem;
  }
  .borders-radius-\.50 {
    border-radius: .5rem;
  }
  .borders-radius-\.75 {
    border-radius: .75rem;
  }
  .borders-radius-1 {
    border-radius: 1rem;
  }

  .border-top-left-radius-\.25 {
    border-top-left-radius: .25rem;
  }
  .border-top-left-radius-\.50 {
    border-top-left-radius: .5rem;
  }
  .border-top-left-radius-\.75 {
    border-top-left-radius: .75rem;
  }
  .border-top-left-radius-1 {
    border-top-left-radius: 1rem;
  }

  .border-top-right-radius-\.25 {
    border-top-right-radius: .25rem;
  }
  .border-top-right-radius-\.50 {
    border-top-right-radius: .5rem;
  }
  .border-top-right-radius-\.75 {
    border-top-right-radius: .75rem;
  }
  .border-top-right-radius-1 {
    border-top-right-radius: 1rem;
  }

  .border-bottom-left-radius-\.25 {
    border-bottom-left-radius: .25rem;
  }
  .border-bottom-left-radius-\.50 {
    border-bottom-left-radius: .5rem;
  }
  .border-bottom-left-radius-\.75 {
    border-bottom-left-radius: .75rem;
  }
  .border-bottom-left-radius-1 {
    border-bottom-left-radius: 1rem;
  }

  .border-bottom-right-radius-\.25 {
    border-bottom-right-radius: .25rem;
  }
  .border-bottom-right-radius-\.50 {
    border-bottom-right-radius: .5rem;
  }
  .border-bottom-right-radius-\.75 {
    border-bottom-right-radius: .75rem;
  }
  .border-bottom-right-radius-1 {
    border-bottom-right-radius: 1rem;
  }

  .borders-radius-50\% {
    border-radius: 50%;
  }

  /**************** Border width ****************/
  .borders-width-unset {
    border: unset;
  }
  .borders-width-\.25 {
    border-width: .25rem;
  }
  .borders-width-\.50 {
    border-width: .5rem;
  }
  .borders-width-\.75 {
    border-width: .75rem;
  }
  .borders-width-1 {
    border-width: 1rem;
  }

  .border-top-width-\.25 {
    border-top-width: .25rem;
  }

  .border-right-width-\.25 {
    border-right-width: .25rem;
  }

  .border-bottom-width-\.25 {
    border-bottom-width: .25rem;
  }

  .border-left-width-\.25 {
    border-left-width: .25rem;
  }

  .border-top-width-\.50 {
    border-top-width: .50rem;
  }

  .border-right-width-\.50 {
    border-right-width: .50rem;
  }

  .border-bottom-width-\.50 {
    border-bottom-width: .50rem;
  }

  .border-left-width-\.50 {
    border-left-width: .50rem;
  }

  .border-top-width-\.75 {
    border-top-width: .75rem;
  }

  .border-right-width-\.75 {
    border-right-width: .75rem;
  }

  .border-bottom-width-\.75 {
    border-bottom-width: .75rem;
  }

  .border-left-width-\.75 {
    border-left-width: .75rem;
  }

  .border-top-width-1 {
    border-top-width: 1rem;
  }

  .border-right-width-1 {
    border-right-width: 1rem;
  }

  .border-bottom-width-1 {
    border-bottom-width: 1rem;
  }

  .border-left-width-1 {
    border-left-width: 1rem;
  }

  /**************** Cursors ****************/
.cursor-default {cursor: default;}
.cursor-help {cursor: help;}
.cursor-pointer {cursor: pointer ;}
.cursor-progress {cursor: progress;}
.cursor-wait {cursor: wait;}
.cursor-alias {cursor: alias;}
.cursor-not-allowed {cursor: not-allowed;}

  /**************** Text colors ****************/
  .txt-white {color: white; }
  
  .txt-accent {color: var(--accent-color); }
  
  .txt-base-5 {color: var(--color-base-5); }
  .txt-base-10 {color: var(--color-base-10); }
  .txt-base-20 {color: var(--color-base-20); }
  .txt-base-30 {color: var(--color-base-30); }
  .txt-base-40 {color: var(--color-base-40); }
  .txt-base-50 {color: var(--color-base-50);}
  .txt-base-60 {color: var(--color-base-60); }
  .txt-base-70 {color: var(--color-base-70); }
  .txt-base-80 {color: var(--color-base-80); }
  .txt-base-90 {color: var(--color-base-90); }

  .txt-low-5 {color: var(--color-low-5); }
  .txt-low-10 {color: var(--color-low-10); }
  .txt-low-20 {color: var(--color-low-20); }
  .txt-low-30 {color: var(--color-low-30); }
  .txt-low-40 {color: var(--color-low-40); }
  .txt-low-50 {color: var(--color-low-50); }
  .txt-low-60 {color: var(--color-low-60); }
  .txt-low-70 {color: var(--color-low-70); }
  .txt-low-80 {color: var(--color-low-80); }
  .txt-low-90 {color: var(--color-low-90); }

  .txt-normal-5 {color: var(--color-normal-5); }
  .txt-normal-10 {color: var(--color-normal-10); }
  .txt-normal-20 {color: var(--color-normal-20); }
  .txt-normal-30 {color: var(--color-normal-30); }
  .txt-normal-40 {color: var(--color-normal-40); }
  .txt-normal-50 {color: var(--color-normal-50); }
  .txt-normal-60 {color: var(--color-normal-60); }
  .txt-normal-70 {color: var(--color-normal-70); }
  .txt-normal-80 {color: var(--color-normal-80); }
  .txt-normal-90 {color: var(--color-normal-90); }

  .txt-important-5 {color: var(--color-important-5); }
  .txt-important-10 {color: var(--color-important-10); }
  .txt-important-20 {color: var(--color-important-20); }
  .txt-important-30 {color: var(--color-important-30); }
  .txt-important-40 {color: var(--color-important-40); }
  .txt-important-50 {color: var(--color-important-50); }
  .txt-important-60 {color: var(--color-important-60); }
  .txt-important-70 {color: var(--color-important-70); }
  .txt-important-80 {color: var(--color-important-80); }
  .txt-important-90 {color: var(--color-important-90); }

  .txt-critical-5 {color: var(--color-critical-5); }
  .txt-critical-10 {color: var(--color-critical-10); }
  .txt-critical-20 {color: var(--color-critical-20); }
  .txt-critical-30 {color: var(--color-critical-30); }
  .txt-critical-40 {color: var(--color-critical-40); }
  .txt-critical-50 {color: var(--color-critical-50); }
  .txt-critical-60 {color: var(--color-critical-60); }
  .txt-critical-70 {color: var(--color-critical-70); }
  .txt-critical-80 {color: var(--color-critical-80); }
  .txt-critical-90 {color: var(--color-critical-90); }

  .txt-success-5 {color: var(--color-success-5); }
  .txt-success-10 {color: var(--color-success-10); }
  .txt-success-20 {color: var(--color-success-20); }
  .txt-success-30 {color: var(--color-success-30); }
  .txt-success-40 {color: var(--color-success-40); }
  .txt-success-50 {color: var(--color-success-50); }
  .txt-success-60 {color: var(--color-success-60); }
  .txt-success-70 {color: var(--color-success-70); }
  .txt-success-80 {color: var(--color-success-80); }
  .txt-success-90 {color: var(--color-success-90); }

  .txt-info-5 {color: var(--color-info-5); }
  .txt-info-10 {color: var(--color-info-10); }
  .txt-info-20 {color: var(--color-info-20); }
  .txt-info-30 {color: var(--color-info-30); }
  .txt-info-40 {color: var(--color-info-40); }
  .txt-info-50 {color: var(--color-info-50); }
  .txt-info-60 {color: var(--color-info-60); }
  .txt-info-70 {color: var(--color-info-70); }
  .txt-info-80 {color: var(--color-info-80); }
  .txt-info-90 {color: var(--color-info-90); }

  .txt-caution-5 {color: var(--color-caution-5); }
  .txt-caution-10 {color: var(--color-caution-10); }
  .txt-caution-20 {color: var(--color-caution-20); }
  .txt-caution-30 {color: var(--color-caution-30); }
  .txt-caution-40 {color: var(--color-caution-40); }
  .txt-caution-50 {color: var(--color-caution-50); }
  .txt-caution-60 {color: var(--color-caution-60); }
  .txt-caution-70 {color: var(--color-caution-70); }
  .txt-caution-80 {color: var(--color-caution-80); }
  .txt-caution-90 {color: var(--color-caution-90); }

  .txt-warning-5 {color: var(--color-warning-5); }
  .txt-warning-10 {color: var(--color-warning-10); }
  .txt-warning-20 {color: var(--color-warning-20); }
  .txt-warning-30 {color: var(--color-warning-30); }
  .txt-warning-40 {color: var(--color-warning-40); }
  .txt-warning-50 {color: var(--color-warning-50); }
  .txt-warning-60 {color: var(--color-warning-60); }
  .txt-warning-70 {color: var(--color-warning-70); }
  .txt-warning-80 {color: var(--color-warning-80); }
  .txt-warning-90 {color: var(--color-warning-90); }

  .txt-error-5 {color: var(--color-error-5); }
  .txt-error-10 {color: var(--color-error-10); }
  .txt-error-20 {color: var(--color-error-20); }
  .txt-error-30 {color: var(--color-error-30); }
  .txt-error-40 {color: var(--color-error-40); }
  .txt-error-50 {color: var(--color-error-50); }
  .txt-error-60 {color: var(--color-error-60); }
  .txt-error-70 {color: var(--color-error-70); }
  .txt-error-80 {color: var(--color-error-80); }
  .txt-error-90 {color: var(--color-error-90); }

  .txt-danger-5 {color: var(--color-danger-5); }
  .txt-danger-10 {color: var(--color-danger-10); }
  .txt-danger-20 {color: var(--color-danger-20); }
  .txt-danger-30 {color: var(--color-danger-30); }
  .txt-danger-40 {color: var(--color-danger-40); }
  .txt-danger-50 {color: var(--color-danger-50); }
  .txt-danger-60 {color: var(--color-danger-60); }
  .txt-danger-70 {color: var(--color-danger-70); }
  .txt-danger-80 {color: var(--color-danger-80); }
  .txt-danger-90 {color: var(--color-danger-90); }

  /**************** Text opacity ****************/
  .txt-opacity-\.25 {
    --txt-opacity: 0.25;
  }

  .txt-opacity-\.50 {
    --txt-opacity: 0.5;
  }

  .txt-opacity-\.75 {
    --txt-opacity: 0.75;
  }

  .txt-opacity-1 {
    --txt-opacity: 1;
  }
  
  /**************** Views ****************/
  .fade {
    filter: brightness(3);
  }

  .shadow-none {
    box-shadow: none;
  }

  .shadow-float {
    box-shadow: var(--shadow-float);
  }

  .shadow-float-alt-1 {
    filter: var(--shadow-float-alt-1);
  }
  
  .shadow-clickable {
    box-shadow: var(--shadow-clickable);
  }

  .shadow-border {
    filter: var(--shadow-border);
  }

  .opacity-\.25 {
    opacity: 0.25;
  }

  .opacity-\.50 {
    opacity: 0.5;
  }

  .opacity-\.75 {
    opacity: 0.75;
  }

  .opacity-1 {
    opacity: 1;
  }
  
  /**************** Visibilities ****************/
  
  /*
  ### Layout
  */
  
  /**************** Dimension ****************/
  .height-25\% {
    height: 25%;
  }

  .height-50\% {
    height: 50%;
  }

  .height-75\% {
    height: 75%;
  }

  .height-10\% {
    height: 100%;
  }

  .height-\.25 {
    height: .25rem;
  }

  .height-\.50 {
    height: .5rem;
  }

  .height-\.75 {
    height: .75rem;
  }

  .height-1 {
    height: 1rem;
  }

  .height-1\.25 {
    height: 1.25rem;
  }

  .height-1\.50 {
    height:  1.5rem;
  }

  .height-1\.75 {
    height: 1.75rem;
  }

  .height-2 {
    height: 2rem;
  }

  .height-2\.50 {
    height: 2.5rem;
  }

  .height-3 {
    height: 3rem;
  }

  .width-25\% {
    width: 25%;
  }

  .width-50\% {
    width: 50%;
  }

  .width-75\% {
    width: 75%;
  }

  .width-80\% {
    width: 80%;
  }

  .width-90\% {
    width: 90%;
  }

  .width-10\% {
    width: 100%;
  }

  .width-\.25 {
    width: .25rem;
  }

  .width-\.50 {
    width: .5rem;
  }

  .width-\.75 {
    width: .75rem;
  }

  .width-1 {
    width: 1rem;
  }

  .width-1\.25 {
    width: 1.25rem;
  }

  .width-1\.50 {
    width:  1.5rem;
  }

  .width-1\.75 {
    width: 1.75rem;
  }

  .width-2 {
    width: 2rem;
  }

  .width-2\.50 {
    width: 2.5rem;
  }

  .width-3 {
    width: 3rem;
  }
  
  /* INFO: Filling availablespace */
  .width-stretch {
    width: stretch;
  }

  .scale-\.25 {
    scale: .25;
  }

  .scale-\.50 {
    scale: .5;
  }

  .scale-\.75 {
    scale: .75;
  }

  .scale-1\.25 {
    scale: 1.25;
  }

  .scale-1\.50 {
    scale: 1.5;
  }

  .scale-2 {
    scale: 2;
  }

  .scale-3 {
    scale: 3;
  }

  .size-\.25 {
    height: .25rem;
    width: .25rem;
  }

  .size-\.50 {
    height: .5rem;
    width: .5rem;
  }

  .size-\.75 {
    height: .75rem;
    width: .75rem;
  }

  .size-1 {
    height: 1rem;
    width: 1rem;
  }

  .size-1\.25 {
    height: 1.25rem;
    width: 1.25rem;
  }

  .size-1\.50 {
    height: 1.5rem;
    width: 1.5rem;
  }

  .size-1\.75 {
    height: 1.75rem;
    width: 1.75rem;
  }

  .size-2 {
    height: 2rem;
    width: 2rem;
  }

  .size-2\.25 {
    height: 2.25rem;
    width: .25rem;
  }

  .size-2\.50 {
    height: 2.5rem;
    width: 2.5rem;
  }

  .size-2\.75 {
    height: 2.75rem;
    width: 2.75rem;
  }

  .size-3 {
    height: 3rem;
    width: 3rem;
  }
  
  .textarea-autogrow {
    field-sizing: content;
    min-height: 3lh;
  }
  
  /**************** Displays ****************/
  .display-none {display: none;}
  .display-block {display: block;}
  .display-inline {display: inline;}
  .display-inline-block {display: inline-block;}
  .display-inline-flex {display: inline-flex;}
  .display-inline-grid {display: inline-grid;}

  .flex-direction-row {
    flex-direction: row;
  }

  .flex-direction-row-reverse {
    flex-direction: row-reverse;
  }

  .flex-direction-column {
    flex-direction: column;
  }

  .flex-direction-column-reverse {
    flex-direction: column-reverse;
  }

  .flex-wrap {
    flex-wrap: wrap;
  }

  .flex-wrap-reverse {
    flex-wrap: wrap-reverse;
  }

  .flex-nowrap {
    flex-wrap: nowrap;
  }

  .flex-auto {
    flex: 1 1 auto;
  }

  .flex-sizes-even > * {
    flex: 1 1 auto;
  }

  .flex-grow {
    flex-grow: 1;
  }

  .flex-grow-none {
    flex-grow: 0;
  }

  .flex-grow-inherit {
    flex-grow: inherit;
  }

  .flex-shrink {
    flex-shrink: 1;
  }

  .flex-shrink-none {
    flex-shrink: 0;
  }

  .flex-shrink-inherit {
    flex-shrink: inherit;
  }

  .flex-basis-auto {
    flex-basis: auto;
  }

  .flex-basis-max-content {
    flex-basis: max-content;
  }

  .flex-basis-min-content {
    flex-basis: min-content;
  }

  .flex-basis-fit-content {
    flex-basis: fit-content;
  }
  
  .display-grid-row {
    display: grid;
    grid-template-rows: repeat(auto-fit, minmax(1rem, max-content));
    grid-auto-flow: column;
    gap: .5rem;
  }

  .display-grid-column {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(3rem, max-content));
    grid-auto-flow: row;
    gap: .25rem;
  }

  .overflow-auto {
    overflow: auto;
  }
  
  .overflow-x-auto {
    overflow-x: auto;
  }
  
  .overflow--y-auto {
    overflow-y: auto;
  }

  .overflow-clip {
    overflow: clip;
  }

  .overflow-hidden {
    overflow: hidden;
  }

  .overflow-visible {
    overflow: visible;
  }
  
  .flip {
    scale: -1;
  }

  .rotate-45 {
    rotate: 45deg;
  }

  .rotate-90 {
    rotate: 90deg;
  }

  .rotate-135 {
    rotate: 135deg;
  }

  .rotate-180 {
    rotate: 180deg;
  }
  
  .clearfix::after {
    clear: both;
    content: "";
    display: table;
  }
  
  /**************** Positions ****************/
  .float-start {
    float: inline-start;
  }
  .float-end {
    float: right;
  }
  .float-center {
    display: block;
    float: none;
    margin-left: auto;
    margin-right: auto;
  }
  
  .position-relative {
    position: relative;
  }
  
  .position-absolute {
    position: absolute;
  }

  .position-fixed {
    position: fixed;
    z-index: var(--z-index-fixed);
  }

  .position-sticky {
    position: -webkit-sticky;
    position: sticky;
    z-index: var(--z-index-sticky);
  }
  
  .inset-top-left {
    inset: 0 auto auto 0;
  }
  
  .inset-top-middle {
    inset: 0 50% auto auto;
    translate: -50%;
  }
  
  .inset-top-right {
    inset: 0 0 auto auto;
  }
  
  .inset-right-middle {
    inset: 50% 0 auto auto;
    translate: 0 -50%;
  }
  
  .inset-bottom-right{
    inset: auto 0 0 auto;
  }
  
  .inset-bottom-middle {
    inset: auto 50% 0 auto;
    translate: 50%;
  }
  
  .inset-bottom-left {
    inset: auto auto 0 0;
  }
  
  .inset-left-middle {
    inset: 50% auto auto 0;
    translate: 0 -50%;
  }
  
  .inset-center {
    inset: 50% auto auto 50%;
    translate: -50% -50%;
  }
  
  .top {
    top: 0;
  }

  .right {
    right: 0;
  }

  .bottom {
    bottom: 0;
  }

  .left {
    left: 0;
  }

  .mid-horizontal {
    left: 50%;
    translate: -50%;
  }

  .mid-vertical {
    top: 50%;
    translate: 0 -50%;
  }
  
  .align-items-baseline {
    align-items: baseline;
  }

  .align-items-center {
    align-items: center;
  }

  .align-items-flex-start {
    align-items: flex-start;
  }

  .align-items-flex-end {
    align-items: flex-end;
  }

  .align-items-stretch {
    align-items: stretch;
  }

  .align-content-normal {
    align-content: normal;
  }

  .align-content-center {
    align-content: center;
  }

  .align-content-flex-start {
    align-content: flex-start;
  }

  .align-content-flex-end {
    align-content: flex-end;
  }

  .align-content-inset-top-middle {
    align-content: space-around;
  }

  .align-content-space-between {
    align-content: space-between;
  }

  .align-content-stretch {
    align-content: stretch;
  }

  .align-self-start {
    align-self: start;
  }

  .justify-content-normal {
    justify-content: normal;
  }

  .justify-content-center {
    justify-content: center;
  }

  .justify-content-flex-start {
    justify-content: flex-start;
  }

  .justify-content-flex-end {
    justify-content: flex-end;
  }

  .justify-content-space-between {
    justify-content: space-between;
  }

  .justify-content-space-around {
    justify-content: space-around;
  }

  .justify-content-space-evenly {
    justify-content: space-evenly;
  }

  .justify-items-normal {
    justify-items: normal;
  }

  .justify-items-center {
    justify-items: center;
  }

  .justify-items-start {
    justify-items: start;
  }

  .justify-items-end {
    justify-items: end;
  }

  .justify-items-stretch {
    justify-items: stretch;
  }

  .vertical-align-baseline {
    vertical-align: baseline;
  }

  .vertical-align-top {
    vertical-align: top;
  }

  .vertical-align-middle {
    vertical-align: middle;
  }

  .vertical-align-bottom {
    vertical-align: bottom;
  }

  .vertical-align-text-bottom {
    vertical-align: text-bottom;
  }

  .vertical-align-text-top {
    vertical-align: text-top;
  }

  .stretch::after {
    content: "";

    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    z-index: 1;
  }

  /**************** Offset ****************/
  .offset-1 {
    margin-left: 8.33333333%;
  }

  .offset-2 {
    margin-left: 16.66666667%;
  }

  .offset-3 {
    margin-left: 25%;
  }

  .offset-4 {
    margin-left: 33.33333333%;
  }

  .offset-5 {
    margin-left: 41.66666667%;
  }

  .offset-6 {
    margin-left: 50%;
  }

  .offset-7 {
    margin-left: 58.33333333%;
  }

  .offset-8 {
    margin-left: 66.66666667%;
  }

  .offset-9 {
    margin-left: 75%;
  }

  .offset-10 {
    margin-left: 83.33333333%;
  }

  .offset-11 {
    margin-left: 91.66666667%;
  }

  /**************** Order ****************/
  .order-first {
    order: -1 !important;
  }

  .order-0 {
    order: 0 !important;
  }

  .order-1 {
    order: 1 !important;
  }

  .order-2 {
    order: 2 !important;
  }

  .order-3 {
    order: 3 !important;
  }

  .order-4 {
    order: 4 !important;
  }

  .order-5 {
    order: 5 !important;
  }

  .order-last {
    order: 6 !important;
  }

  /**************** Spaces ****************/
  .gap-unset {
    gap: unset;
  }

  .gap-\.25 {
    gap: .25rem;
  }

  .gap-\.50 {
    gap: .5rem;
  }

  .gap-\.75 {
    gap: .75rem;
  }

  .gap-1 {
    gap: 1rem;
  }

  .gap-1\.25 {
    gap: 1.25rem;
  }

  .gap-1\.50 {
    gap: 1.5rem;
  }

  .gap-1\.75 {
    gap: 1.75rem;
  }

  .gap-2 {
    gap: 2rem;
  }

  .gap-2\.25 {
    gap: 2.25rem;
  }

  .gap-2\.50 {
    gap: 2.5rem;
  }

  .gap-2\.75 {
    gap: 2.75rem;
  }

  .gap-3 {
    gap: 3rem;
  }

  .column-gap-\.25 {
    column-gap: .25rem;
  }

  .column-gap-\.50 {
    column-gap: .5rem;
  }

  .column-gap-\.75 {
    column-gap: .75rem;
  }

  .column-gap-1 {
    column-gap: 1rem;
  }

  .column-gap-1\.25 {
    column-gap: 1.25rem;
  }

  .column-gap-1\.50 {
    column-gap: 1.5rem;
  }

  .column-gap-1\.75 {
    column-gap: 1.75rem;
  }

  .column-gap-2 {
    column-gap: 2rem;
  }

  .column-gap-2\.25 {
    column-gap: 2.25rem;
  }

  .column-gap-2\.50 {
    column-gap: 2.5rem;
  }

  .column-gap-2\.75 {
    column-gap: 2.75rem;
  }

  .column-gap-3 {
    column-gap: 3rem;
  }

  .row-gap-\.25 {
    row-gap: .25rem;
  }

  .row-gap-\.50 {
    row-gap: .5rem;
  }

  .row-gap-\.75 {
    row-gap: .75rem;
  }

  .row-gap-1 {
    row-gap: 1rem;
  }

  .row-gap-1\.25 {
    row-gap: 1.25rem;
  }

  .row-gap-1\.50 {
    row-gap: 1.5rem;
  }

  .row-gap-1\.75 {
    row-gap: 1.75rem;
  }

  .row-gap-2 {
    row-gap: 2rem;
  }

  .row-gap-2\.25 {
    row-gap: 2.25rem;
  }

  .row-gap-2\.50 {
    row-gap: 2.5rem;
  }

  .row-gap-2\.75 {
    row-gap: 2.75rem;
  }

  .row-gap-3 {
    row-gap: 3rem;
  }

  .margins-unset {
    margin: unset;
  }
  .margin-top-unset {
    margin-top: unset;
  }
  .margin-right-unset {
    margin-right: unset;
  }
  .margin-bottom-unset {
    margin-bottom: unset;
  }
  .margin-left-unset {
    margin-left: unset;
  }

  .margins-min-\.25 {
    margin: -.25rem;
  }
  .margins-min-\.50 {
    margin: -.5rem;
  }
  .margins-min-\.75 {
    margin: -.75rem;
  }
  .margins-min-1 {
    margin: -1rem;
  }
  .margins-min-1\.25 {
    margin: -1.25rem;
  }
  .margins-min-1\.50 {
    margin: -1.5rem;
  }
  .margins-min-1\.75 {
    margin: -1.75rem;
  }
  .margins-min-2 {
    margin: -2rem;
  }
  .margins-min-2\.25 {
    margin: -2.25rem;
  }
  .margins-min-2\.50 {
    margin: -2.5rem;
  }
  .margins-min-2\.75 {
    margin: -2.75rem;
  }
  .margins-min-3 {
    margin: -3rem;
  }

  .margin-top-min-\.25 {
    margin-top: -.25rem;
  }
  .margin-right-min-\.25 {
    margin-right: -.25rem;
  }
  .margin-bottom-min-\.25 {
    margin-bottom: -.25rem;
  }
  .margin-left-min-\.25 {
    margin-left: -.25rem;
  }

  .margin-top-min-\.50 {
    margin-top: -.50rem;
  }
  .margin-right-min-\.50 {
    margin-right: -.50rem;
  }
  .margin-bottom-min-\.50 {
    margin-bottom: -.50rem;
  }
  .margin-left-min-\.50 {
    margin-left: -.50rem;
  }

  .margin-top-min-\.75 {
    margin-top: -.75rem;
  }
  .margin-right-min-\.75 {
    margin-right: -.75rem;
  }
  .margin-bottom-min-\.75 {
    margin-bottom: -.75rem;
  }
  .margin-left-min-\.75 {
    margin-left: -.75rem;
  }

  .margin-top-min-1 {
    margin-top: -1rem;
  }
  .margin-right-min-1 {
    margin-right: -1rem;
  }
  .margin-bottom-min-1 {
    margin-bottom: -1rem;
  }
  .margin-left-min-1 {
    margin-left: -1rem;
  }

  .margin-top-min-1\.25 {
    margin-top: -1.25rem;
  }
  .margin-right-min-1\.25 {
    margin-right: -1.25rem;
  }
  .margin-bottom-min-1\.25 {
    margin-bottom: -1.25rem;
  }
  .margin-left-min-1\.25 {
    margin-left: -1.25rem;
  }

  .margin-top-min-1\.50 {
    margin-top: -1.50rem;
  }
  .margin-right-min-1\.50 {
    margin-right: -1.50rem;
  }
  .margin-bottom-min-1\.50 {
    margin-bottom: -1.50rem;
  }
  .margin-left-min-1\.50 {
    margin-left: -1.50rem;
  }

  .margin-top-min-1\.75 {
    margin-top: -1.75rem;
  }
  .margin-right-min-1\.75 {
    margin-right: -1.75rem;
  }
  .margin-bottom-min-1\.75 {
    margin-bottom: -1.75rem;
  }
  .margin-left-min-1\.75 {
    margin-left: -1.75rem;
  }

  .margin-top-min-2 {
    margin-top: -2rem;
  }
  .margin-right-min-2 {
    margin-right: -2rem;
  }
  .margin-bottom-min-2 {
    margin-bottom: -2rem;
  }
  .margin-left-min-2 {
    margin-left: -2rem;
  }

  .margin-top-min-2\.25 {
    margin-top: -2.25rem;
  }
  .margin-right-min-2\.25 {
    margin-right: -2.25rem;
  }
  .margin-bottom-min-2\.25 {
    margin-bottom: -2.25rem;
  }
  .margin-left-min-2\.25 {
    margin-left: -2.25rem;
  }

  .margin-top-min-2\.50 {
    margin-top: -2.50rem;
  }
  .margin-right-min-2\.50 {
    margin-right: -2.50rem;
  }
  .margin-bottom-min-2\.50 {
    margin-bottom: -2.50rem;
  }
  .margin-left-min-2\.50 {
    margin-left: -2.50rem;
  }

  .margin-top-min-2\.75 {
    margin-top: -2.75rem;
  }
  .margin-right-min-2\.75 {
    margin-right: -2.75rem;
  }
  .margin-bottom-min-2\.75 {
    margin-bottom: -2.75rem;
  }
  .margin-left-min-2\.75 {
    margin-left: -2.75rem;
  }

  .margin-top-min-3 {
    margin-top: -3rem;
  }
  .margin-right-min-3 {
    margin-right: -3rem;
  }
  .margin-bottom-min-3 {
    margin-bottom: -3rem;
  }
  .margin-left-min-3 {
    margin-left: -3rem;
  }

  .margins-auto {
    margin: auto;
  }
  .margins-block-auto {
    margin-block: auto;
  }
  .margins-inline-auto {
    margin-inline: auto;
  }
  .margin-top-auto {
    margin-top: auto;
  }
  .margin-right-auto {
    margin-right: auto;
  }
  .margin-bottom-auto {
    margin-bottom: auto;
  }
  .margin-left-auto {
    margin-left: auto;
  }

  .margins-\.25 {
    margin: .25rem;
  }
  .margins-\.50 {
    margin: .5rem;
  }
  .margins-\.75 {
    margin: .75rem;
  }
  .margins-1 {
    margin: 1rem;
  }
  .margins-1\.25 {
    margin: 1.25rem;
  }
  .margins-1\.50 {
    margin: 1.5rem;
  }
  .margins-1\.75 {
    margin: 1.75rem;
  }
  .margins-2 {
    margin: 2rem;
  }
  .margins-2\.25 {
    margin: 2.25rem;
  }
  .margins-2\.50 {
    margin: 2.5rem;
  }
  .margins-2\.75 {
    margin: 2.75rem;
  }
  .margins-3 {
    margin: 3rem;
  }

  .margin-top-\.25 {
    margin-top: .25rem;
  }
  .margin-right-\.25 {
    margin-right: .25rem;
  }
  .margin-bottom-\.25 {
    margin-bottom: .25rem;
  }
  .margin-left-\.25 {
    margin-left: .25rem;
  }

  .margin-top-\.50 {
    margin-top: .50rem;
  }
  .margin-right-\.50 {
    margin-right: .50rem;
  }
  .margin-bottom-\.50 {
    margin-bottom: .50rem;
  }
  .margin-left-\.50 {
    margin-left: .50rem;
  }

  .margin-top-\.75 {
    margin-top: .75rem;
  }
  .margin-right-\.75 {
    margin-right: .75rem;
  }
  .margin-bottom-\.75 {
    margin-bottom: .75rem;
  }
  .margin-left-\.75 {
    margin-left: .75rem;
  }

  .margin-top-1 {
    margin-top: 1rem;
  }
  .margin-right-1 {
    margin-right: 1rem;
  }
  .margin-bottom-1 {
    margin-bottom: 1rem;
  }
  .margin-left-1 {
    margin-left: 1rem;
  }

  .margin-top-1\.25 {
    margin-top: 1.25rem;
  }
  .margin-right-1\.25 {
    margin-right: 1.25rem;
  }
  .margin-bottom-1\.25 {
    margin-bottom: 1.25rem;
  }
  .margin-left-1\.25 {
    margin-left: 1.25rem;
  }

  .margin-top-1\.50 {
    margin-top: 1.50rem;
  }
  .margin-right-1\.50 {
    margin-right: 1.50rem;
  }
  .margin-bottom-1\.50 {
    margin-bottom: 1.50rem;
  }
  .margin-left-1\.50 {
    margin-left: 1.50rem;
  }

  .margin-top-1\.75 {
    margin-top: 1.75rem;
  }
  .margin-right-1\.75 {
    margin-right: 1.75rem;
  }
  .margin-bottom-1\.75 {
    margin-bottom: 1.75rem;
  }
  .margin-left-1\.75 {
    margin-left: 1.75rem;
  }

  .margin-top-2 {
    margin-top: 2rem;
  }
  .margin-right-2 {
    margin-right: 2rem;
  }
  .margin-bottom-2 {
    margin-bottom: 2rem;
  }
  .margin-left-2 {
    margin-left: 2rem;
  }

  .margin-top-2\.25 {
    margin-top: 2.25rem;
  }
  .margin-right-2\.25 {
    margin-right: 2.25rem;
  }
  .margin-bottom-2\.25 {
    margin-bottom: 2.25rem;
  }
  .margin-left-2\.25 {
    margin-left: 2.25rem;
  }

  .margin-top-2\.50 {
    margin-top: 2.50rem;
  }
  .margin-right-2\.50 {
    margin-right: 2.50rem;
  }
  .margin-bottom-2\.50 {
    margin-bottom: 2.50rem;
  }
  .margin-left-2\.50 {
    margin-left: 2.50rem;
  }

  .margin-top-2\.75 {
    margin-top: 2.75rem;
  }
  .margin-right-2\.75 {
    margin-right: 2.75rem;
  }
  .margin-bottom-2\.75 {
    margin-bottom: 2.75rem;
  }
  .margin-left-2\.75 {
    margin-left: 2.75rem;
  }

  .margin-top-3 {
    margin-top: 3rem;
  }
  .margin-right-3 {
    margin-right: 3rem;
  }
  .margin-bottom-3 {
    margin-bottom: 3rem;
  }
  .margin-left-3 {
    margin-left: 3rem;
  }

  .paddings-unset {
    padding: unset;
  }
  .padding-top-unset {
    padding-top: unset;
  }
  .padding-right-unset {
    padding-right: unset;
  }
  .padding-bottom-unset {
    padding-bottom: unset;
  }
  .padding-left-unset {
    padding-left: unset;
  }

  .padding-top-min-\.25 {
    padding-top: -.25rem;
  }
  .padding-right-min-\.25 {
    padding-right: -.25rem;
  }
  .padding-bottom-min-\.25 {
    padding-bottom: -.25rem;
  }
  .padding-left-min-\.25 {
    padding-left: -.25rem;
  }

  .padding-top-min-\.50 {
    padding-top: -.50rem;
  }
  .padding-right-min-\.50 {
    padding-right: -.50rem;
  }
  .padding-bottom-min-\.50 {
    padding-bottom: -.50rem;
  }
  .padding-left-min-\.50 {
    padding-left: -.50rem;
  }

  .padding-top-min-\.75 {
    padding-top: -.75rem;
  }
  .padding-right-min-\.75 {
    padding-right: -.75rem;
  }
  .padding-bottom-min-\.75 {
    padding-bottom: -.75rem;
  }
  .padding-left-min-\.75 {
    padding-left: -.75rem;
  }

  .padding-top-min-1 {
    padding-top: -1rem;
  }
  .padding-right-min-1 {
    padding-right: -1rem;
  }
  .padding-bottom-min-1 {
    padding-bottom: -1rem;
  }
  .padding-left-min-1 {
    padding-left: -1rem;
  }

  .padding-top-min-1\.25 {
    padding-top: -1.25rem;
  }
  .padding-right-min-1\.25 {
    padding-right: -1.25rem;
  }
  .padding-bottom-min-1\.25 {
    padding-bottom: -1.25rem;
  }
  .padding-left-min-1\.25 {
    padding-left: -1.25rem;
  }

  .padding-top-min-1\.50 {
    padding-top: -1.50rem;
  }
  .padding-right-min-1\.50 {
    padding-right: -1.50rem;
  }
  .padding-bottom-min-1\.50 {
    padding-bottom: -1.50rem;
  }
  .padding-left-min-1\.50 {
    padding-left: -1.50rem;
  }

  .padding-top-min-1\.75 {
    padding-top: -1.75rem;
  }
  .padding-right-min-1\.75 {
    padding-right: -1.75rem;
  }
  .padding-bottom-min-1\.75 {
    padding-bottom: -1.75rem;
  }
  .padding-left-min-1\.75 {
    padding-left: -1.75rem;
  }

  .padding-top-min-2 {
    padding-top: -2rem;
  }
  .padding-right-min-2 {
    padding-right: -2rem;
  }
  .padding-bottom-min-2 {
    padding-bottom: -2rem;
  }
  .padding-left-min-2 {
    padding-left: -2rem;
  }

  .padding-top-min-2\.25 {
    padding-top: -2.25rem;
  }
  .padding-right-min-2\.25 {
    padding-right: -2.25rem;
  }
  .padding-bottom-min-2\.25 {
    padding-bottom: -2.25rem;
  }
  .padding-left-min-2\.25 {
    padding-left: -2.25rem;
  }

  .padding-top-min-2\.50 {
    padding-top: -2.50rem;
  }
  .padding-right-min-2\.50 {
    padding-right: -2.50rem;
  }
  .padding-bottom-min-2\.50 {
    padding-bottom: -2.50rem;
  }
  .padding-left-min-2\.50 {
    padding-left: -2.50rem;
  }

  .padding-top-min-2\.75 {
    padding-top: -2.75rem;
  }
  .padding-right-min-2\.75 {
    padding-right: -2.75rem;
  }
  .padding-bottom-min-2\.75 {
    padding-bottom: -2.75rem;
  }
  .padding-left-min-2\.75 {
    padding-left: -2.75rem;
  }

  .padding-top-min-3 {
    padding-top: -3rem;
  }
  .padding-right-min-3 {
    padding-right: -3rem;
  }
  .padding-bottom-min-3 {
    padding-bottom: -3rem;
  }
  .padding-left-min-3 {
    padding-left: -3rem;
  }

  .paddings-\.25 {
    padding: .25rem;
  }
  .paddings-\.50 {
    padding: .5rem;
  }
  .paddings-\.75 {
    padding: .75rem;
  }
  .paddings-1 {
    padding: 1rem;
  }
  .paddings-1\.25 {
    padding: 1.25rem;
  }
  .paddings-1\.50 {
    padding: 1.5rem;
  }
  .paddings-1\.75 {
    padding: 1.75rem;
  }
  .paddings-2 {
    padding: 2rem;
  }
  .paddings-2\.25 {
    padding: 2.25rem;
  }
  .paddings-2\.50 {
    padding: 2.5rem;
  }
  .paddings-2\.75 {
    padding: 2.75rem;
  }
  .paddings-3 {
    padding: 3rem;
  }

  .padding-top-\.25 {
    padding-top: .25rem;
  }
  .padding-right-\.25 {
    padding-right: .25rem;
  }
  .padding-bottom-\.25 {
    padding-bottom: .25rem;
  }
  .padding-left-\.25 {
    padding-left: .25rem;
  }

  .padding-top-\.50 {
    padding-top: .50rem;
  }
  .padding-right-\.50 {
    padding-right: .50rem;
  }
  .padding-bottom-\.50 {
    padding-bottom: .50rem;
  }
  .padding-left-\.50 {
    padding-left: .50rem;
  }

  .padding-top-\.75 {
    padding-top: .75rem;
  }
  .padding-right-\.75 {
    padding-right: .75rem;
  }
  .padding-bottom-\.75 {
    padding-bottom: .75rem;
  }
  .padding-left-\.75 {
    padding-left: .75rem;
  }

  .padding-top-1 {
    padding-top: 1rem;
  }
  .padding-right-1 {
    padding-right: 1rem;
  }
  .padding-bottom-1 {
    padding-bottom: 1rem;
  }
  .padding-left-1 {
    padding-left: 1rem;
  }

  .padding-top-1\.25 {
    padding-top: 1.25rem;
  }
  .padding-right-1\.25 {
    padding-right: 1.25rem;
  }
  .padding-bottom-1\.25 {
    padding-bottom: 1.25rem;
  }
  .padding-left-1\.25 {
    padding-left: 1.25rem;
  }

  .padding-top-1\.50 {
    padding-top: 1.50rem;
  }
  .padding-right-1\.50 {
    padding-right: 1.50rem;
  }
  .padding-bottom-1\.50 {
    padding-bottom: 1.50rem;
  }
  .padding-left-1\.50 {
    padding-left: 1.50rem;
  }

  .padding-top-1\.75 {
    padding-top: 1.75rem;
  }
  .padding-right-1\.75 {
    padding-right: 1.75rem;
  }
  .padding-bottom-1\.75 {
    padding-bottom: 1.75rem;
  }
  .padding-left-1\.75 {
    padding-left: 1.75rem;
  }

  .padding-top-2 {
    padding-top: 2rem;
  }
  .padding-right-2 {
    padding-right: 2rem;
  }
  .padding-bottom-2 {
    padding-bottom: 2rem;
  }
  .padding-left-2 {
    padding-left: 2rem;
  }

  .padding-top-2\.25 {
    padding-top: 2.25rem;
  }
  .padding-right-2\.25 {
    padding-right: 2.25rem;
  }
  .padding-bottom-2\.25 {
    padding-bottom: 2.25rem;
  }
  .padding-left-2\.25 {
    padding-left: 2.25rem;
  }

  .padding-top-2\.50 {
    padding-top: 2.50rem;
  }
  .padding-right-2\.50 {
    padding-right: 2.50rem;
  }
  .padding-bottom-2\.50 {
    padding-bottom: 2.50rem;
  }
  .padding-left-2\.50 {
    padding-left: 2.50rem;
  }

  .padding-top-2\.75 {
    padding-top: 2.75rem;
  }
  .padding-right-2\.75 {
    padding-right: 2.75rem;
  }
  .padding-bottom-2\.75 {
    padding-bottom: 2.75rem;
  }
  .padding-left-2\.75 {
    padding-left: 2.75rem;
  }

  .padding-top-3 {
    padding-top: 3rem;
  }
  .padding-right-3 {
    padding-right: 3rem;
  }
  .padding-bottom-3 {
    padding-bottom: 3rem;
  }
  .padding-left-3 {
    padding-left: 3rem;
  }

  .paddings-min-\.25 {
    padding: -.25rem;
  }
  .paddings-min-\.50 {
    padding: -.5rem;
  }
  .paddings-min-\.75 {
    padding: -.75rem;
  }
  .paddings-min-1 {
    padding: -1rem;
  }
  .paddings-min-1\.25 {
    padding: -1.25rem;
  }
  .paddings-min-1\.50 {
    padding: -1.5rem;
  }
  .paddings-min-1\.75 {
    padding: -1.75rem;
  }
  .paddings-min-2 {
    padding: -2rem;
  }
  .paddings-min-2\.25 {
    padding: -2.25rem;
  }
  .paddings-min-2\.50 {
    padding: -2.5rem;
  }
  .paddings-min-2\.75 {
    padding: -2.75rem;
  }
  .paddings-min-3 {
    padding: -3rem;
  }

  .grid-row-span-2 {
    grid-row-start: span 2;
    grid-row-end: auto;
  }

  .grid-row-span-3 {
    grid-row-start: span 3;
    grid-row-end: auto;
  }

  .grid-row-span-4 {
    grid-row-start: span 4;
    grid-row-end: auto;
  }

  .grid-column-span-2 {
    grid-column-start: span 2;
    grid-column-end: auto;
  }

  .grid-column-span-3 {
    grid-column-start: span 3;
    grid-column-end: auto;
  }

  .grid-column-span-4 {
    grid-column-start: span 4;
    grid-column-end: auto;
  }
  
  
  /**************** Index ****************/
  .z-index-layover {
    z-index: var(--z-index-layover);
  }

  .z-index-dropdown {
    z-index: var(--z-index-dropdown);
  }

  .z-index-sticky {
    z-index: var(--z-index-sticky);
  }

  .z-index-fixed {
    z-index: var(--z-index-fixed);
  }

  .z-index-offcanvas-backdrop {
    z-index: var(--z-index-offcanvas-backdrop);
  }

  .z-index-offcanvas {
    z-index: var(--z-index-offcanvas);
  }

  .z-index-modal-backdrop {
    z-index: var(--z-index-modal-backdrop);
  }

  .z-index-modal {
    z-index: var(--z-index-modal);
  }

  .z-index-popover {
    z-index: var(--z-index-popover);
  }

  .z-index-tooltip {
    z-index: var(--z-index-tooltip);
  }
  
  
  /*
  ### Typography & Font
  */
  
  /**************** Header ****************/
  /*
   * INFO: Make size slightly bigger than h1-h6
   */
  .header-1,
  .header-2,
  .header-3,
  .header-4,
  .header-5,
  .header-6,
  .header-7,
  .header-8 {
    font: var(--h--font-weight) 4rem / var(--h--line-height) var(--h--font-family);
    
    letter-spacing: var(--h--letter-spacing);
    color: var(--h--color, var(--font-color-alt-1));
  }
  
  :where(.header-1,
    .header-2,
    .header-3,
    .header-4,
    .header-5,
    .header-6,
    .header-7,
    .header-8) {
    display: block;
    
    margin: 2.5rem 0 1.25rem;
  }
  
  .header-1 {
    font-size: clamp(4rem, calc(4rem + 0.125vw), 4.5rem);
  }

  .header-2 {
    font-size: clamp(3.5rem, calc(3.5rem + 0.125vw), 4rem);
  }

  .header-3 {
    font-size: clamp(3rem, calc(3rem + 0.125vw), 3.5rem);
  }

  .header-4 {
    font-size: clamp(2.5rem, calc(2.5rem + 0.125vw), 3rem);
    line-height: 1.125;
  }

  .header-5 {
    font-size: clamp(2rem, calc(2rem + 0.125vw), 2.5rem);
    line-height: 1.125;
  }
  
  .header-6, .header-7, .header-8 {
    line-height: clamp(1em, 1.5em - .75vw, 1.5em);
    letter-spacing: normal;
  }

  .header-6 {
    font-size: clamp(1.5rem, calc(1.5rem + 0.125vw), 2rem);
  }

  .header-7 {
    font-size: clamp(1.125rem, calc(1.125rem + 0.125vw), 1.5rem);
  }

  .header-8 {
    font-size:clamp(1rem, calc(1rem + .125vw), 1.25rem);
  }
  
  /**************** Subheader & Subtext ****************/
  .subheader,
  .subtext {
    opacity: .8;
    display: block;
    margin: .5em 0;
  }

  .subheader {
    font-size: max(50%, .5em);
    font-size: calc(1em / 1.618);
  }

  .subtext {
    font-size: .8rem;
  }
  
  /**************** Drop caps (initial letter) ****************/
  .initial-letter-2::first-letter {
    initial-letter: 2;
  }
  
  .initial-letter-3::first-letter {
    initial-letter: 3;
  }
  
  /**************** Font size, weight, style ****************/
  .font-size-\.1 {
    font-size: .10rem;
  }

  .font-size-\.25 {
    font-size: .25rem;
  }

  .font-size-\.50 {
    font-size: .50rem;
  }

  .font-size-\.75 {
    font-size: .75rem;
  }

  .font-size-1\.50 {
    font-size: 1.5rem;
  }

  .font-size-1 {
    font-size: 1rem;
  }

  .font-size-2 {
    font-size: 2rem;
  }

  .font-size-3 {
    font-size: 3rem;
  }
  
  .font-weight-100 {
    font-weight: 100;
  }
  
  .font-weight-200 {
    font-weight: 200;
  }
  
  .font-weight-300 {
    font-weight: 300;
  }
  
  .font-weight-400 {
    font-weight: 400;
  }
  
  .font-weight-500 {
    font-weight: 500;
  }
  
  .font-weight-600 {
    font-weight: 600;
  }
  
  .font-weight-700 {
    font-weight: 700;
  }
  
  .font-weight-800 {
    font-weight: 800;
  }
  
  .font-weight-900 {
    font-weight: 900;
  }

  .font-weight-normal {
    font-weight: normal;
  }

  .font-weight-bold {
    font-weight: bold;
  }

  .font-style-italic {
    font-style: italic;
  }
  
  /**************** Text align, transform, decoration, wrap, muted, truncate ****************/
  .txt-align-start {
    text-align: left;
  }
  .txt-align-end {
    text-align: right;
  }
  .txt-align-center {
    text-align: center;
  }
  .txt-align-justify {
    text-align: justify;
  }

  .txt-transform-lowercase {
    text-transform: lowercase;
  }

  .txt-transform-uppercase {
    text-transform: uppercase;
  }

  .txt-transform-capitalize {
    text-transform: capitalize;
  }

  .txt-decoration-underline {
    text-decoration: underline;
  }

  .txt-decoration-line-through {
    text-decoration: line-through;
  }

  .txt-decoration-none {
    text-decoration: none;
  }

  .txt-nowrap {
    text-wrap-mode: nowrap;
  }
  .txt-muted {
    opacity: oklch(from currentColor l c h / .7);
  }

  .txt-truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  
  .multiline-truncate {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    overflow: hidden;
  }
  
  /**************** Line height ****************/
  .line-height-1 {
    line-height: 1;
  }

  .line-height-1\.1 {
    line-height: 1.1;
  }

  .line-height-1\.125 {
    line-height: 1.125;
  }

  .line-height-1\.25 {
    line-height: 1.25;
  }
  .line-height-1\.5 {
    line-height: 1.5;
  }
  
  /**************** Text wrap ****************/
  .text-wrap-balance {
    text-wrap: balance;
  }
  
  
  /*
  ### Interactions
  */
  .pointer-events-none {
    pointer-events: none;
  }

  .txt-select-all {
    -webkit-user-select: all;
    -moz-user-select: all;
    user-select: all;
  }

  .txt-select-auto {
    -webkit-user-select: auto;
    -moz-user-select: auto;
    user-select: auto;
  }

  .txt-select-none {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
  }
  
  /* INFO: Prevent scroll chaining */
  .overscroll-behavior-contain {
    overscroll-behavior: contain;
  }
  
  
  .lazy-render > *:nth-child() {
    content-visibility: auto;
    contain-intrinsic-size: auto 500px;
  }
  
  /*
  ### @container
  */
  @container (max-width: 1280px) {
    .offset-md-0 {
      margin-left: 0;
    }

    .offset-md-1 {
      margin-left: 8.33333333%;
    }

    .offset-md-2 {
      margin-left: 16.66666667%;
    }

    .offset-md-3 {
      margin-left: 25%;
    }

    .offset-md-4 {
      margin-left: 33.33333333%;
    }

    .offset-md-5 {
      margin-left: 41.66666667%;
    }

    .offset-md-6 {
      margin-left: 50%;
    }

    .offset-md-7 {
      margin-left: 58.33333333%;
    }

    .offset-md-8 {
      margin-left: 66.66666667%;
    }

    .offset-md-9 {
      margin-left: 75%;
    }

    .offset-md-10 {
      margin-left: 83.33333333%;
    }

    .offset-md-11 {
      margin-left: 91.66666667%;
    }

    .order-md-first {
      order: -1 !important;
    }

    .order-md-0 {
      order: 0 !important;
    }

    .order-md-1 {
      order: 1 !important;
    }

    .order-md-2 {
      order: 2 !important;
    }

    .order-md-3 {
      order: 3 !important;
    }

    .order-md-4 {
      order: 4 !important;
    }

    .order-md-5 {
      order: 5 !important;
    }

    .order-md-last {
      order: 6 !important;
    }


    .txt-md-align-start {
      text-align: start;
    }

    .txt-md-align-end {
      text-align: end;
    }

    .txt-md-align-center {
      text-align: center;
    }

    .txt-md-align-justify {
      text-align: justify;
    }
  }

  @container (max-width: 768px) {
    .offset-sm-0 {
      margin-left: 0;
    }

    .offset-sm-1 {
      margin-left: 8.33333333%;
    }

    .offset-sm-2 {
      margin-left: 16.66666667%;
    }

    .offset-sm-3 {
      margin-left: 25%;
    }

    .offset-sm-4 {
      margin-left: 33.33333333%;
    }

    .offset-sm-5 {
      margin-left: 41.66666667%;
    }

    .offset-sm-6 {
      margin-left: 50%;
    }

    .offset-sm-7 {
      margin-left: 58.33333333%;
    }

    .offset-sm-8 {
      margin-left: 66.66666667%;
    }

    .offset-sm-9 {
      margin-left: 75%;
    }

    .offset-sm-10 {
      margin-left: 83.33333333%;
    }

    .offset-sm-11 {
      margin-left: 91.66666667%;
    }

    .order-sm-first {
      order: -1 !important;
    }

    .order-sm-0 {
      order: 0 !important;
    }

    .order-sm-1 {
      order: 1 !important;
    }

    .order-sm-2 {
      order: 2 !important;
    }

    .order-sm-3 {
      order: 3 !important;
    }

    .order-sm-4 {
      order: 4 !important;
    }

    .order-sm-5 {
      order: 5 !important;
    }

    .order-sm-last {
      order: 6 !important;
    }

    .txt-sm-align-start {
      text-align: start;
    }

    .txt-sm-align-end {
      text-align: end;
    }

    .txt-sm-align-center {
      text-align: center;
    }

    .txt-sm-align-justify {
      text-align: justify;
    }
  }

  @container (max-width: 640px) {
    .offset-xs-0 {
      margin-left: 0;
    }

    .offset-xs-1 {
      margin-left: 8.33333333%;
    }

    .offset-xs-2 {
      margin-left: 16.66666667%;
    }

    .offset-xs-3 {
      margin-left: 25%;
    }

    .offset-xs-4 {
      margin-left: 33.33333333%;
    }

    .offset-xs-5 {
      margin-left: 41.66666667%;
    }

    .offset-xs-6 {
      margin-left: 50%;
    }

    .offset-xs-7 {
      margin-left: 58.33333333%;
    }

    .offset-xs-8 {
      margin-left: 66.66666667%;
    }

    .offset-xs-9 {
      margin-left: 75%;
    }

    .offset-xs-10 {
      margin-left: 83.33333333%;
    }

    .offset-xs-11 {
      margin-left: 91.66666667%;
    }

    .order-xs-first {
      order: -1 !important;
    }

    .order-xs-0 {
      order: 0 !important;
    }

    .order-xs-1 {
      order: 1 !important;
    }

    .order-xs-2 {
      order: 2 !important;
    }

    .order-xs-3 {
      order: 3 !important;
    }

    .order-xs-4 {
      order: 4 !important;
    }

    .order-xs-5 {
      order: 5 !important;
    }

    .order-xs-last {
      order: 6 !important;
    }




    .txt-xs-align-start {
      text-align: start;
    }

    .txt-xs-align-end {
      text-align: end;
    }

    .txt-xs-align-center {
      text-align: center;
    }

    .txt-xs-align-justify {
      text-align: justify;
    }
  }

  /*
  ### @Media screen
  */
  @media screen and (max-width: 1280px) {
  }

  @media screen and (max-width: 768px) {
  }

  @media screen and (max-width: 640px) {}
    
}