@layer base, ui;

:root{
  --font-style:normal;
  --font-variant:normal;
  --font-weight:300;
  --font-stretch:normal;
  --font-size:16px;
  --line-height:1.5;
  --font-family:Lato, "Helvetica Neue", sans-serif;
  --letter-spacing:0.06em;
  
  --accent-color:oklch(0.59 0.11 281.84);
  
  --font-color:oklch(0 0 0);
  --font-color:oklch(0.23 0.04 280.81);
  --font-color-alt-1:oklch(0.44 0.02 284.16);
  --font-color-alt-1:oklch(0.34 0.02 283.59);
  --font-color-alt-2:oklch(0.6 0.02 285.26);
  --font-color-alt-2:oklch(0.49 0.02 283.94);
  
  --background-color:oklch(0.98 0 0);
  --background-color-text-alt-1:oklch(0.36 0.02 285.26);
  --background-color-text:oklch(0.95 0.01 285.37);
  --background-color-clickable:oklch(0.96 0.01 285.53);
  --transparent-color:oklch(from var(--accent-color) l c h / .15);
  
  --href--color:oklch(0.56 0.22 276.32);
  --href--visited-color:oklch(0.42 0.13 279.17);
  
  --shadow-float:0 3px 10px 0 var(--transparent-color);
  --shadow-clickable:0 2px 2px 0 var(--transparent-color);
  
  --focus-outline:0.25rem solid var(--transparent-color);
  --focus--box-shadow:0 0 0 0.25rem var(--transparent-color);
  --border-color-control:oklch(0.75 0.02 285.18);
  
  --boundary--border-width:1px;
  --boundary--border-style:solid;
  --boundary--border-color:oklch(0.82 0.02 285.18);

  --h--font-family:Montserrat, sans-serif;
  --h--font-weight:500;
  --h--line-height:1;
  --h--letter-spacing:-0.016em;
  --h--color:var(--font-color-alt-1);
  --small-header--font-weight:500;
  
  --backdrop--background:oklch(0.34 0.03 284.04 / 0.9);
  
  --dialog--border-color:var(--boundary--border-color);
  --blockquote--border-width:0 0 0 4px;
  --blockquote--border-color:var(--boundary--border-color);
  --blockquote__footer--color:var(--font-color-alt-2);
  --blockquote__footer--margin:1rem 0 0;
  
  --pre--color:var(--font-color-alt-1);
  --pre--background:var(--background-color-text);
  --cks--font-family:"Sometype Mono", monospace, monospace;
  --cks--font-size:1.125rem;
  --cks--font-weight:400;

  --code--color:var(--font-color);
  --code--background:oklch(from var(--background-color-text) .9 c h / .4);

  --kbd--color:#fff;
  --kbd--background:var(--background-color-text-alt-1);
  --kbd--border-radius:3px;
  
  --kbd_-kbd--border-style:solid;
  --kbd_-kbd--border-color:var(--boundary--border-color);
  --kbd_-kbd--border-width:1px 2px 3px 1px;
  --kbd_-kbd--padding:0 0.5rem 0.25rem .25rem;
  
  --kbd__kbd--font-weight:400;
  --kbd__kbd--color:var(--font-color);

  --controls--color:var(--font-color);
  --controls--border-width:1px; 
  --controls--border-style:solid; 
  --controls--border-color:var(--border-color-control);
  --controls--border-radius:0.125em;
  --controls--min-height:1.75rem;
  --controls--padding:0.125em 0.25em 0.25em;

  --input--background:#fff;
  
  --btn--font-weight:400;
  --btn--font-size:var(--font-size);
  --btn--line-height:1.5;
  --btn--padding:.2lh .75lh .25lh;

  --moz-input--padding:0.125em 0.25em 0.25em;
  --moz-input--select-padding:0.125em 0.25em 0.25em;
  --moz-btn-padding:.2lh .75lh .25lh;
  
  --elements-block-level-space:1rem;
  --color-base-white:#fff;
  --color-base-1:oklch(0.99 0 0);
  --color-base-2:oklch(0.99 0 0);
  --color-base-5:oklch(0.98 0 0);
  --color-base-6:oklch(0.96 0.02 285.26);
  --color-base-7:oklch(0.93 0.02 285.26);
  --color-base-8:oklch(0.9 0.02 285.26);
  --color-base-9:oklch(0.87 0.02 285.26);
  --color-base-10:oklch(0.77 0.02 285.26);
  --color-base-20:oklch(0.67 0.02 285.26);
  --color-base-30:oklch(0.57 0.02 285.26);
  --color-base-40:oklch(0.47 0.02 285.26);
  
  --color-base-50:oklch(0.36 0.02 285.26);
  
  --color-base-60:oklch(0.31 0.02 285.26);
  --color-base-70:oklch(0.26 0.02 285.26);
  --color-base-80:oklch(0.21 0.02 285.26);
  --color-base-90:oklch(0.16 0.02 285.26);
  
  --color-low-5:oklch(0.97 0.06 129.67);
  --color-low-10:oklch(0.96 0.1 134.3);
  --color-low-20:oklch(0.94 0.14 134.71);
  --color-low-30:oklch(0.91 0.13 133.87);
  --color-low-40:oklch(0.86 0.15 134.24);
  --color-low-50:oklch(0.58 0.19 135.24);
  --color-low-60:oklch(0.51 0.19 135.24);
  --color-low-70:oklch(0.46 0.19 135.24);
  --color-low-80:oklch(0.39 0.19 135.24);
  --color-low-90:oklch(0.19 0.19 135.24);
  
  --color-normal-5:oklch(0.98 0.08 107.75);
  --color-normal-10:oklch(0.96 0.1 106.96);
  --color-normal-20:oklch(0.93 0.11 107.32);
  --color-normal-30:oklch(0.91 0.14 107.68);
  --color-normal-40:oklch(0.86 0.15 107.93);
  --color-normal-50:oklch(0.58 0.15 108.19);
  --color-normal-60:oklch(0.5 0.15 108.19);
  --color-normal-70:oklch(0.44 0.15 108.19);
  --color-normal-80:oklch(0.37 0.15 108.19);
  --color-normal-90:oklch(0.2 0.15 108.19);
  
  --color-important-5:oklch(0.95 0.02 51.36);
  --color-important-10:oklch(0.95 0.03 51.33);
  --color-important-20:oklch(0.94 0.04 51.31);
  --color-important-30:oklch(0.91 0.06 51.27);
  --color-important-40:oklch(0.86 0.07 51.23);
  --color-important-50:oklch(0.61 0.13 50.75);
  --color-important-60:oklch(0.54 0.13 50.75);
  --color-important-70:oklch(0.49 0.13 50.75);
  --color-important-80:oklch(0.42 0.13 50.75);
  --color-important-90:oklch(0.29 0.13 50.75);
  
  --color-critical-5:oklch(0.97 0.03 329.25);
  --color-critical-10:oklch(0.96 0.04 329.32);
  --color-critical-20:oklch(0.95 0.06 329.46);
  --color-critical-30:oklch(0.92 0.09 329.69);
  --color-critical-40:oklch(0.89 0.13 330.04);
  --color-critical-50:oklch(0.63 0.18 335.23);
  --color-critical-60:oklch(0.57 0.18 335.16);
  --color-critical-70:oklch(0.52 0.18 335.16);
  --color-critical-80:oklch(0.46 0.18 335.16);
  --color-critical-90:oklch(0.23 0.22 335.7);
  
  --color-info-5:oklch(0.99 0.04 177.23);
  --color-info-10:oklch(0.94 0.04 178.96);
  --color-info-20:oklch(0.93 0.06 176.76);
  --color-info-30:oklch(0.9 0.07 176.68);
  --color-info-40:oklch(0.86 0.1 175.98);
  --color-info-50:oklch(0.57 0.09 175.98);
  --color-info-60:oklch(0.51 0.09 175.98);
  --color-info-70:oklch(0.47 0.09 175.98);
  --color-info-80:oklch(0.38 0.09 175.98);
  --color-info-90:oklch(0.17 0.09 175.98);
  
  --color-success-5:oklch(0.97 0.06 129.67);
  --color-success-10:oklch(0.96 0.1 134.3);
  --color-success-20:oklch(0.94 0.14 134.71);
  --color-success-30:oklch(0.91 0.13 133.87);
  --color-success-40:oklch(0.86 0.15 134.24);
  --color-success-50:oklch(0.58 0.19 135.24);
  --color-success-60:oklch(0.51 0.19 135.24);
  --color-success-70:oklch(0.46 0.19 135.24);
  --color-success-80:oklch(0.39 0.19 135.24);
  --color-success-90:oklch(0.19 0.19 135.24);
  
  --color-caution-5:oklch(0.98 0.08 107.75);
  --color-caution-10:oklch(0.96 0.1 106.96);
  --color-caution-20:oklch(0.93 0.11 107.32);
  --color-caution-30:oklch(0.91 0.14 107.68);
  --color-caution-40:oklch(0.86 0.15 107.93);
  --color-caution-50:oklch(0.58 0.15 108.19);
  --color-caution-60:oklch(0.5 0.15 108.19);
  --color-caution-70:oklch(0.44 0.15 108.19);
  --color-caution-80:oklch(0.37 0.15 108.19);
  --color-caution-90:oklch(0.2 0.15 108.19);
  
  --color-warning-5:oklch(0.95 0.02 51.36);
  --color-warning-10:oklch(0.95 0.03 51.33);
  --color-warning-20:oklch(0.94 0.04 51.31);
  --color-warning-30:oklch(0.91 0.06 51.27);
  --color-warning-40:oklch(0.86 0.07 51.23);
  --color-warning-50:oklch(0.61 0.13 50.75);
  --color-warning-60:oklch(0.54 0.13 50.75);
  --color-warning-70:oklch(0.49 0.13 50.75);
  --color-warning-80:oklch(0.42 0.13 50.75);
  --color-warning-90:oklch(0.29 0.13 50.75);
  
  --color-error-5:oklch(0.97 0.03 329.25);
  --color-error-10:oklch(0.96 0.04 329.32);
  --color-error-20:oklch(0.95 0.06 329.46);
  --color-error-30:oklch(0.92 0.09 329.69);
  --color-error-40:oklch(0.89 0.13 330.04);
  --color-error-50:oklch(0.63 0.18 335.23);
  --color-error-60:oklch(0.57 0.18 335.16);
  --color-error-70:oklch(0.52 0.18 335.16);
  --color-error-80:oklch(0.46 0.18 335.16);
  --color-error-90:oklch(0.23 0.22 335.7);
  
  --color-danger-5:oklch(0.93 0.04 9.18);
  --color-danger-10:oklch(0.91 0.06 10.23);
  --color-danger-20:oklch(0.99 0.23 17.23);
  --color-danger-30:oklch(0.91 0.23 17.23);
  --color-danger-40:oklch(0.83 0.23 17.23);
  --color-danger-50:oklch(0.7 0.23 17.23);
  --color-danger-60:oklch(0.64 0.23 17.23);
  --color-danger-70:oklch(0.61 0.23 17.23);
  --color-danger-80:oklch(0.54 0.21 16.44);
  --color-danger-90:oklch(0.22 0.23 17.23);
  --space-distance-1:1rem;
  --space-distance-2:1.25rem;
  --space-distance-3:1.5rem;
  --space-distance-4:1.75rem;
  --space-distance-5:2rem;
  
  --space-group-1:.125rem;
  --space-group-2:.25rem;
  --space-group-3:.5rem;
  --space-group-4:.75rem;
  --space-group-5:1rem;
  --z-index-layover:900;
  --z-index-dropdown:1000;
  --z-index-sticky:1020;
  --z-index-fixed:1030;
  --z-index-offcanvas-backdrop:1040;
  --z-index-offcanvas:1045;
  --z-index-modal-backdrop:1050;
  --z-index-modal:1055;
  --z-index-popover:1070;
  --z-index-tooltip:1080;
  --background-color-off:oklch(0.9 0.02 285.26);
  --background-color-active:oklch(0.97 0.01 285.51);
  --shadow-float-alt-1:drop-shadow(0 2px 2px var(--transparent-color));
  --shadow-border:drop-shadow(0 1px 1px var(--transparent-color));
  
  --indicator-dimension:1em;
  --badge--color:var(--color-base-50);
  --badge--background:var(--background-color-text);
  --badge--border-color:var(--boundary--border-color);
  
  --btn--icon-font-size:var(--btn--font-size);
  --as-btn--padding:.21lh 1em .26lh;
  --as-btn--padding:.2lh .75lh .25lh;
  
  --toggle-size:1;
  
  --divider--background:var(--background-color);
  
  --navbar--background:var(--background-color);
  --nav__nav--background:var(--background-color);
  --navbar--breadcrumb-gap:0 1.5rem;
  
  --step__body--color:var(--font-color-alt-2);
  --step__indicator--border-color:var(--background-color);
  
  --tabs__nav--border-color:var(--boundary--border-color);
  --tabs__content--background:var(--background-color);
  --tab__nav--active--background:var(--background-color);
  
  --notice--background-color:var(--background-color);
  --notice--border-color:var(--boundary--border-color);
  
  --popper-space:1;
  --popper--background:var(--background-color);
  --popper--border-color:var(--boundary--border-color);
  
  --appear-size:300px;
  --appear--offcanvas_-appear__content--background:var(--background-color);
  
  --accordions--height:290px;
  --accordions--background:var(--background-color);
  --accordion--border-color:var(--boundary--border-color);
  --accordion__header--background:var(--background-color-clickable);
  --accordion__header--border-color:var(--boundary--border-color);
  
  --card--background:var(--background-color);
  --cards--slide--height:auto;
  
  --slide__indicator-item--border-color:var(--boundary--border-color);
  --slide__indicator-item--active--border-color:var(--boundary--border-color);
  --slide-prev-nav:attr(be-prev-nav, "<");
  --slide-next-nav:attr(be-next-nav, ">");
}

@layer base{
  *,:after,:before{
    box-sizing:border-box;
    margin:0;
    padding:0;
  }

  :focus-visible{
    outline:var(--focus-outline);
    outline-offset:0;
  }

  :where([type=range]):focus-visible{
    outline:none;
  }

  html{
    font:var(--font, var(--font-style) var(--font-variant) var(--font-weight)
    var(--font-stretch) var(--font-size) / var(--line-height)
    var(--font-family));
    -moz-text-size-adjust:100%;
    -webkit-text-size-adjust:100%;
    text-size-adjust:100%;
    
    scroll-behavior:smooth;
    &:has(dialog[open],dialog[popover]:popover-open){
      overflow:hidden;
    }
  }

  body{
    accent-color:var(--accent-color);
    background:var(--background-color);
    color:var(--font-color);
    letter-spacing:var(--letter-spacing);
    
    min-height:100vh;
  }

  main{
    display:block;
  }

  h1,h2,h3,h4,h5,h6{
    color:var(--h--color);
    font:var(--h--font-weight) 4rem / var(--h--line-height) var(--h--font-family);
    
    letter-spacing:var(--h--letter-spacing);
    
    margin:2.5rem 0 1.25rem;
  }
  
  h1{
    font-size:clamp(2.799rem, calc(2.799rem + .125vw), 3.799rem);
  }

  h2{
    font-size:clamp(2.332rem, calc(2.332rem + .125vw), 3.332rem);
  }

  h3{
    font-size:clamp(1.944rem, calc(1.944rem + .125vw), 2.944rem);
  }

  h3,h4{
    line-height:1.125;
  }

  h4{
    font-size:clamp(1.62rem, calc(1.62rem + .125vw), 2.62rem);
  }

  h5{
    font-size:clamp(1.35rem, calc(1.35rem + .125vw), 2.35rem);
  }

  h5,h6{
    letter-spacing:normal;
    line-height:clamp(1em, 1.5em - .75vw, 1.5em);
  }

  h6{
    font-size:clamp(1.125rem, calc(1.125rem + .125vw), 2.125rem);
  }

  blockquote{
    --data-quoter-marker:attr(data-quoter-marker, "\2014 \00A0");
    border-color:var(--blockquote--border-color);
    border-style:var(--blockquote--border-style, solid);
    border-width:var(--blockquote--border-width);
    margin:0 0 0 1rem;
    padding:1rem;

    :where(&) footer{
      color:var(--blockquote__footer--color);
      margin:var(--blockquote__footer--margin);
    }

    :where(&) footer:before{
      content:var(--data-quoter-marker);
    }
  }

  ol,ul{
    padding:0 0 0 1.25em;
  }

  fieldset{
    border:0 var(--boundary--border-style) var(--boundary--border-color);
    border-width:var(--boundary--border-width);
    padding:.5rem;

    :where(&)>label{
      margin:0 1rem 0 0;
    }
  }

  legend{
    color:inherit;
    display:table;
    padding:0;
    white-space:normal;
  }

  details{
    display:block;
  }

  summary{
    cursor:pointer;
    display:list-item;
  }

  dt{
    color:var(--font-color-alt-1);
    font-weight:var(--small-header--font-weight, bold);
  }

  pre{
    background:var(--pre--background);
    border:var(--pre--border, var(--boundary--border-width) var(--boundary--border-style) var(--boundary--border-color));
    color:var(--pre--color);
    overflow:auto;
    padding:1rem;
  }

  hr{
    border:var(--boundary--border-width) var(--boundary--border-style) var(--boundary--border-color);
    border-width:0 0 1px;
    box-sizing:content-box;

    color:inherit;
    margin:.5rem 0;
    overflow:visible;
  }

  a{
    display:inline-block;
  }

  [href]{
    color:var(--href--color);

    &:focus,&:hover{
      filter:brightness(105%);
    }

    &:visited{
      color:var(--href--visited-color);
    }
  }

  abbr[title]{
    border-bottom:none;
    -webkit-text-decoration:underline dotted;
    text-decoration:underline dotted;
  }

  audio,video{
    display:inline-block;
  }

  audio:not([controls]){
    display:none;
  }

  b,strong{
    font-weight:700;
  }

  code,kbd,samp{
    font:normal var(--cks--font-weight) var(--cks--font-size) var(--cks--font-family);
    font-optical-sizing:auto;
  }

  code{
    background:var(--code--background);
    color:var(--code--color);
  }

  kbd{
    background:var(--kbd--background);
    border-radius:var(--kbd--border-radius);
    color:var(--kbd--color);

    &:has(kbd){
      background-color:unset;
      border:0 var(--kbd_-kbd--border-style) var(--kbd_-kbd--border-color);
      border-width:var(--kbd_-kbd--border-width);
      padding:var(--kbd_-kbd--padding);
    }
    
    kbd{
      background-color:unset;
      
      color:var(--kbd__kbd--color);
      font-weight:var(--kbd__kbd--font-weight);
    }
  }

  small{
    font-size:80%;
  }

  sub,sup{
    font-size:75%;
    line-height:0;
    position:relative;
    vertical-align:baseline;
  }

  sub{
    bottom:-.25em;
  }

  sup{
    top:-.5em;
  }

  img{
    border:none;
    
    display:inline-block;
    
    max-height:90vh;
    max-width:90vw;
  }
  
  figure{
    :where(&) img{
      line-height:1;
      margin:auto auto .5rem;
    }
  }
  
  figcaption{
    font-size:.875em;
  }

  svg:not(:root){
    overflow:hidden;
  }

  table{
    border-color:inherit;
    text-indent:0;
  }
  
  th{
    color:var(--font-color-alt-1);
    font-weight:var(--small-header--font-weight, bold);
  }

  td{
    padding:.5em;
  }
  [popover],dialog,template{
    display:none;
  }
  [popover],dialog{
    background:var(--background-color);
    border:unset;
    
    box-shadow:var(--shadow-float);
    
    color:inherit;
    inset:50% auto auto 50%;
    opacity:0;
    
    overflow:visible;
    padding:1rem;
    pointer-events:none;
    
    position:fixed;

    text-align:initial;
    
    transform:translate(-50%, -50%) scale(.85);
    transition:opacity .35s ease-in-out,transform .35s ease-in-out,overlay allow-discrete .35s,display allow-discrete .35s;

    z-index:1000;
  }

  dialog{
    background:var(--dialog--background, var(--background-color));
    border:0 var(--dialog--border-style, solid) var(--dialog--border-color);
    border-radius:var(--dialog--border-radius, .125em);
      border-width:var(--dialog--border-width, 1px);
    color:var(--dialog--color, var(--font-color));
    height:var(--dialog--height, auto);
    max-height:calc(100vh - 4rem);
    max-width:clamp(280px, 100vw - 4rem, 1160px);
    
    min-height:5rem;
    
    min-width:clamp(280px, 100vw - 4rem, 400px);
    width:var(--dialog--width, auto);
  }

  [popover]{
    height:var(--popover--height, auto);
    max-height:calc(100vh - 2rem);
    max-width:clamp(4rem, 100vw - 2rem, 1200px);
    
    width:var(--popover--width, auto);
  }

  [popover]:popover-open,dialog[open]{
    
    display:block;
    
    opacity:1;
    pointer-events:auto;
    transform:translate(-50%, -50%) scale(1);
    @starting-style{
      opacity:0;
      transform:translate(-50%, -50%) scale(.85);
    }
  }

  [popover]::backdrop,dialog::backdrop{
    backdrop-filter:blur(1px);
    background:var(--backdrop--background);
  }

  progress{
    display:inline-block;
    vertical-align:baseline;
  }
  
  button,input,optgroup,option,select,textarea{
    color:var(--controls--color);
    font:var(--font-weight) var(--font-size)/var(--line-height) var(--font-family);
  }
  
  button,input,optgroup,select,textarea{
    border:0 var(--controls--border-style) var(--controls--border-color);
      border-width:var(--controls--border-width);
    margin:0;
    min-height:var(--controls--min-height);
    padding:var(--controls--padding);
  }
  
  button,input,select{
    text-transform:none;
  }

  .btn,[type=button],[type=reset],[type=submit],button{

    -webkit-appearance:button;
    -moz-appearance:button;
    appearance:button;

    background-color:var(--btn--background, var(--background-color-clickable, revert));

    border:0 var(--btn--border-style, solid) var(--btn--border-color, var(--border-color-control));
    border-radius:var(--btn--border-radius, .25em);
      border-width:var(--btn--border-width, 1px);

    box-shadow:var(--btn--shadow, var(--shadow-clickable));
    color:var(--btn--color, var(--font-color));
    cursor:pointer;

    font:var(--btn--font, normal var(--btn--font-weight) var(--btn--font-size) / var(--btn--line-height) var(--font-family));

    min-height:var(--controls--min-height);

    overflow:visible;

    padding:var(--btn--padding);

    position:relative;
    text-align:center;
    text-decoration:none;

    -webkit-user-select:none;
    -moz-user-select:none;
    user-select:none;
    vertical-align:middle;
    :where(&:hover,&:focus):not(:disabled){
      filter:brightness(103%);
    }

    :where(&:active):not(:disabled){
      box-shadow:none;
      filter:brightness(105%);
      transform:translateY(1px);
    }

    &:disabled{
      color:revert;
    }

    &:focus-visible{
      box-shadow:none;
    }
  }

  [type=color],input,select,textarea{
    background:var(--input--background);
    border-radius:var(--controls--border-radius);
  }
  
  select{
    min-width:1.7em;
  }
  
  optgroup{
    border:none;
    color:var(--font-color-alt-2);
    padding:.125em;
  }
  
  option{
    margin:0 0 0 .5em;
    padding:.25em .25em .125em;
    
    &:checked{
      background-color:var(--background-color-text);
      color:var(--accent-color);
    }
  }
  
  textarea{
    overflow:auto;
    vertical-align:top;
  }
  
  input{
    overflow:visible;
  }
  
  [type=checkbox],[type=color],[type=file],[type=radio],[type=range]{
    cursor:pointer;
  }
  
  [type=color]{
    background:inherit;
    min-height:2rem;
    padding:.25em;
  }

  [type=date],[type=datetime-local],[type=month],[type=time],[type=week]{
    padding:.125em .25em;
  }

  [type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{
    height:auto;
  }

  [type=search]{
    -webkit-appearance:textfield;
    appearance:textfield;
  }

  [type=search]::-webkit-search-decoration{
    -webkit-appearance:none;
  }

  [type=file]{
    padding:0 .125em 0 0;
  }

  ::file-selector-button{
    -webkit-appearance:button;
    
    background-color:var(--btn--background, var(--background-color-clickable, revert));
    border:0 var(--btn--border-style, solid) var(--btn--border-color, var(--border-color-control));
      border-width:var(--btn--border-width, 1px);
    color:var(--btn--color, var(--font-color));
    cursor:pointer;
    
    font:var(--btn--font, normal var(--btn--font-weight) var(--btn--font-size) / var(--btn--line-height) var(--font-family));
    margin:-1px .125em -1px -1px;
    
    padding:.125em .25em;
  }
  
  [type=range]:focus-visible::-webkit-slider-thumb{
    border-radius:50%;

    height:.8em;
    outline:var(--focus-outline);
    width:.8em;
  }
  
  [type=checkbox],[type=radio]{
    min-height:auto;
    padding:0;
  }
  
  input[type=checkbox]{
    -webkit-appearance:none;
    -moz-appearance:none;
        appearance:none;
    display:inline-grid;
    font-size:inherit;
    height:.75em;
    place-content:center;
    width:.75em;
  }
    
  input[type=checkbox]:before{
    background-color:var(--accent-color);
    -webkit-clip-path:polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0, 43% 62%);
            clip-path:polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0, 43% 62%);
    content:"";
    height:.65em;
    transform:scale(0);
    width:.5em;
  }

  input[type=checkbox]:checked:before{
    transform:scale(1) rotate(15deg);
  }
  
  input[type=radio]{
    -webkit-appearance:none;
    -moz-appearance:none;
        appearance:none;
    border-radius:50%;
    display:inline-grid;
    font-size:inherit;
    height:.875em;
    place-content:center;
    
    translate:0 -.05lh;
    width:.875em;
  }

  input[type=radio]:before{
    background-color:var(--accent-color);
    border-radius:50%;
    content:"";
    height:.5em;
    transform:scale(0);
    width:.5em;
  }

  input[type=radio]:checked:before{
    transform:scale(1);
  }

  [disabled]{
    cursor:not-allowed;
    filter:contrast(.5);
  }

  [hidden]{
    display:none;
  }
  :target{
    scroll-margin-block:5ex;
  }

  :where(dl,ol,ul,fieldset,p,details,pre,form,address,blockquote,figure,table):has(+:is(dl,ol,ul,fieldset,p,details,pre,form,address,blockquote,figure,table,nav)){
    margin-bottom:var(--elements-block-level-space);
  }
  .btn,[type=button],[type=reset],[type=submit],audio,button,details,input,select,textarea,video{
    margin:.25rem;
  }

  @-moz-document url-prefix(){
    .btn,[type=button],[type=reset],[type=submit],button{
      padding:var(--moz-btn-padding);
    }

    [type=date],[type=datetime-local],[type=datetime],[type=email],[type=month],[type=number],[type=password],[type=search],[type=tel],[type=text],[type=time],[type=url],[type=week],textarea{
      padding:var(--moz-input--padding);
    }

    select{
      min-width:1.5em;
      padding:var(--moz-input--select-padding);

      &:focus{
        outline:var(--focus-outline);
      }
    }

    input[type=range]{
      background:transparent;
      border:none;

      &:active{
        filter:brightness(120%);
      }

      &::-moz-range-thumb{
        background:var(--accent-color);
        border:none;

        height:1rem;
        width:1rem;
      }

      &:focus-visible::-moz-range-thumb{
        outline:var(--focus-outline);
      }

      &::-moz-range-track{
        background:var(--accent-color);
        border-radius:.25rem;
        cursor:pointer;
        height:.5rem;
      }
    }
  }
}

@layer ui{
  a{
    :where(&.ignore-visited):visited{
        color:currentColor;
    }
  }
  .avatar{
    background:var(--background-color-text);

    border-radius:.125em;

    display:inline-block;
    font:300 var(--avatar--font-size, .75rem) var(--font-family);

    height:var(--avatar--height, 2em);

    position:relative;

    text-align:center;
    width:var(--avatar--width, 2em);
  }

  [data-avatar-name]:before{
      content:attr(data-avatar-name);
    font-size:.5em;
    inset:50% auto auto 50%;

    overflow:hidden;

    position:absolute;
    translate:-50% -50%;

    width:80%;
  }
  
  .avatar__img{

    height:100%;
    inset:0 auto auto 0;
    width:100%;
  }

  .avatar__figure:not(img),.avatar__img{
    border-radius:inherit;

    position:absolute;

    z-index:1;
  }

  .avatar__figure:not(img){

    display:block;
    inset:50% auto auto 50%;

    translate:-50% -50%;
  }

  .avatar__indicator{
    background:var(--background-color-off);

    border-radius:50%;
    box-shadow:0 0 0 1px var(--color-base-5);

    height:var(--avatar__indicator--height, .65em);
    inset:0 -.25em auto auto;

    position:absolute;

    text-align:center;
    width:var(--avatar__indicator--width, .65em);

    z-index:1;
  }

  .avatar--circle{
    border-radius:50%;

    .avatar__indicator{
      inset:0 0 auto auto;

      translate:0;
    }
  }
  .badge{
    align-items:baseline;
    background:var(--badge--background);

    border:0 var(--badge--border-style, solid) var(--badge--border-color);
    border-radius:var(--badge--border-radius, 1rem);
      border-width:var(--badge--border-width, 1px);

    color:var(--badge--color);

    display:inline-block;
    
    display:inline-flex;
      
    font:normal normal var(--badge--font-size, .9rem) / 1 var(--font-family);
    margin:0;
    
    min-height:var(--badge--min-height, .75rem);
    min-width:var(--badge--min-width, .75rem);
    padding:.125rem .5rem .25rem;
      user-select:none;

    white-space:nowrap;
    
    a&{
      text-decoration:none;
    }
  }

  .badge--accent{
    background:var(--accent-color);
    border-color:var(--accent-color);
    color:#fff;
  }

  .badge--low{
    background:var(--color-low-10);
    border-color:var(--color-low-20);
  }

  .badge--normal{
    background:var(--color-normal-10);
    border-color:var(--color-normal-20);
  }

  .badge--important{
    background:var(--color-important-10);
    border-color:var(--color-important-20);
  }

  .badge--critical{
    background:var(--color-critical-10);
    border-color:var(--color-critical-20);
  }

  .badge--success{
    background:var(--color-success-10);
    border-color:var(--color-success-20);
  }

  .badge--info{
    background:var(--color-info-10);
    border-color:var(--color-info-20);
  }

  .badge--caution{
    background:var(--color-caution-10);
    border-color:var(--color-caution-20);
  }

  .badge--warning{
    background:var(--color-warning-10);
    border-color:var(--color-warning-20);
  }

  .badge--error{
    background:var(--color-error-10);
    border-color:var(--color-error-20);
  }

  .badge--danger{
    background:var(--color-danger-10);
    border-color:var(--color-danger-20);
    color:var(--color-danger-70);
  }
  .badge--chip{
    background:var(--background-color);
    
    border:1px solid;
    border-radius:.25rem;

    transition:color .2s ease-out,background .2s ease-out,border .2s ease-out;
    
    :where(&) .btn--icon{
      color:inherit;
    }

    &:where(.badge--accent){
      color:var(--accent-color);
    }

    &:where(.badge--low){
      color:var(--color-low-50);
    }

    &:where(.badge--normal){
      color:var(--color-normal-50);
    }

    &:where(.badge--important){
      color:var(--color-important-50);
    }

    &:where(.badge--critical){
      color:var(--color-critical-50);
    }

    &:where(.badge--success){
      color:var(--color-success-50);
    }

    &:where(.badge--info){
      color:var(--color-info-50);
    }

    &:where(.badge--caution){
      color:var(--color-caution-50);
    }

    &:where(.badge--warning){
      color:var(--color-warning-50);
    }

    &:where(.badge--error){
      color:var(--color-error-50);
    }

    &:where(.badge--danger){
      color:var(--color-danger-50);
    }
  }
  .btn{
    font-size:var(--btn--font-size);

    transition:color .5s ease-out,background .5s ease-out,border .5s ease-out;
  }

  .btn:not(:where(button,[type=button],[type=reset],[type=submit])){
    padding:var(--as-btn--padding);
  }

  .btn--icon{
    background:none;
    border:none;
    border-radius:50%;

    box-shadow:none;
    font-size:var(--btn--icon-font-size);
    line-height:1;

    margin:0;
    min-height:auto;
    padding:0;

    &:focus,&:hover{
      scale:1.1;
    }

    &:hover{
      box-shadow:none;
    }
    
    .badge &{
      translate:0 .125em;
    }
  }
  
  .btn--accent{
    background:var(--accent-color);
    border-color:var(--accent-color);
    color:#fff;
  }

  .btn--low{
    background:var(--color-low-30);
    border-color:var(--color-low-40);
  }

  .btn--normal{
    background:var(--color-normal-30);
    border-color:var(--color-normal-40);
  }

  .btn--important{
    background:var(--color-important-30);
    border-color:var(--color-important-40);
  }

  .btn--critical{
    background:var(--color-critical-30);
    border-color:var(--color-critical-40);
  }

  .btn--success{
    background:var(--color-success-30);
    border-color:var(--color-success-40);
  }

  .btn--info{
    background:var(--color-info-30);
    border-color:var(--color-info-40);
  }

  .btn--caution{
    background:var(--color-caution-30);
    border-color:var(--color-caution-40);
  }

  .btn--warning{
    background:var(--color-warning-30);
    border-color:var(--color-warning-40);
  }

  .btn--error{
    background:var(--color-error-30);
    border-color:var(--color-error-40);
  }

  .btn--danger{
    background:var(--color-danger-30);
    border-color:var(--color-danger-40);
  }

  .btn--ghost{
    background:oklch(from var(--accent-color) l c h / .05);
    border:0;
    box-shadow:none;
    text-decoration:underline 2px dotted var(--color-base-9);

    &:focus{
      text-decoration-style:solid;
    }
    
    &:active{
      background:oklch(from var(--accent-color) l c h / .25);
    }
  }

  .btn--bordered{
    background:revert-layer;
    border-color:currentColor;

    :where(&).btn--accent{
      color:var(--accent-color);
    }

    :where(&).btn--low{
      color:var(--color-low-50);
    }

    :where(&).btn--normal{
      color:var(--color-normal-50);
    }

    :where(&).btn--important{
      color:var(--color-important-50);
    }

    :where(&).btn--critical{
      color:var(--color-critical-50);
    }

    :where(&).btn--success{
      color:var(--color-success-50);
    }

    :where(&).btn--info{
      color:var(--color-info-50);
    }

    :where(&).btn--caution{
      color:var(--color-caution-50);
    }

    :where(&).btn--warning{
      color:var(--color-warning-50);
    }

    :where(&).btn--error{
      color:var(--color-error-50);
    }

    :where(&).btn--danger{
      color:var(--color-danger-50);
    }
  }
  [be-removeable]{
    align-items:flex-end;

    display:inline-flex;
    
    opacity:1;

    transition:opacity .35s linear,display allow-discrete .35s,scale .2s linear;
      user-select:none;

    :where(&)>.btn{
      margin:auto auto auto .75em;
    }

    &:has([data-state-handler]:not(:checked)){
      display:none;
      opacity:0;
      scale:85%;
    }

    &:has([data-state-handler]:focus-visible){
        outline:var(--focus-outline);
    }
  }
  [be-switchable]{
    border-color:var(--border-color-control);
    
    color:var(--font-color-alt-2);

    cursor:pointer;
      user-select:none;

    :where(&)>.visual-indicator{
      margin:0 .5em 0 0;
      overflow:clip;
      
      transition:opacity .35s ease-out,width .2s ease-out,margin .2s ease-out;
    }

    &:has([data-state-handler]:focus-visible){
        outline:var(--focus-outline);
    }
  }
  
  :has(>[data-state-handler]:checked),[selected]{
    [be-switchable]:not(&){
      .active-visible{
        margin:0;
        opacity:0;
        width:0;
      }
    }
    
    [be-switchable]:is(&){
      background:var(--accent-color);
      border-color:var(--accent-color);
      color:#fff;
      
      .active-invisible{
        margin:0;
        opacity:0;
        width:0;
      }
    }
  }
  .toggle{
    align-items:baseline;
    display:inline-flex;

    &:has(:where([data-toggle-handler-on],[data-toggle-handler-off-on]):not(:checked)) .active-visible,&:has([data-toggle-handler-off]:not(:checked),[data-toggle-handler-off-on]:checked) .active-invisible{
      display:none;
    }
  }

  .toggle__control{
    align-items:center;
    align-self:center;

    border:none;

    display:flex;
    height:calc(.75em*var(--toggle-size));
    margin:0 .5em;
    padding:0;

    position:relative;
    width:calc(1.5em*var(--toggle-size));


    &>label{
      cursor:pointer;

      display:block;

      height:inherit;

      position:absolute;
      width:inherit;

      z-index:1;

      &:has(:is([data-toggle-handler-off],[data-toggle-handler-on]):checked){
        height:0;
        opacity:0;
        width:0;
        z-index:-1;
      }
    }

    &:has([data-toggle-handler-off]:focus-visible,[data-toggle-handler-on]:focus-visible,[data-toggle-handler-off-on]:focus-visible):after{
        outline:var(--focus-outline);
    }

    &:has(:is([data-toggle-handler-on],[data-toggle-handler-off-on]):checked){
      &:after,.toggle__indicator{
        inset:0 0 auto auto;
      }
    }

    &:has(:is([data-toggle-handler-off],[data-toggle-handler-on],[data-toggle-handler-off-on]):disabled)>label{
      cursor:not-allowed;
    }

    &:after,&:before{
      content:"";
      display:block;

      position:absolute;
    }
    &:before{
      background:var(--background-color-off);
      border:0 var(--controls--border-style) var(--controls--border-color);
      border-radius:calc(1em*var(--toggle-size));
        border-width:var(--controls--border-width);

      height:calc(var(--toggle-path-size, .5em)*var(--toggle-size));
      transition:background .2s ease-in-out;
      width:100%;
    }
    &:has(>.toggle__indicator){
      &:after{
        display:none;
      }
      
      &:has([data-toggle-handler-off]:focus-visible,[data-toggle-handler-on]:focus-visible,[data-toggle-handler-off-on]:focus-visible):before{
          outline:var(--focus-outline);
      }
    }
  }
  .toggle__indicator{
    align-items:center;
    display:flex;
    justify-content:center;
  }
  
  .toggle__control:after,.toggle__indicator{
    background:var(--background-color-clickable);

    border:0 var(--controls--border-style) var(--controls--border-color);
    border-radius:50%;
      border-width:var(--controls--border-width);
    box-shadow:none;

    height:calc(.75em*var(--toggle-size));
    inset:0 calc(100% - .75em*var(--toggle-size)) auto auto;

    position:absolute;

    transition:inset .2s ease-in-out;
    width:calc(.75em*var(--toggle-size));
  }

  .toggle:is(.toggle--mutual) .toggle__control,.toggle__control:has(:is([data-toggle-handler-on],[data-toggle-handler-off-on]):checked){
    &:before{
      background:var(--color-base-5);
    }

    &:after,.toggle__indicator{
      background:var(--accent-color);
    }
  }

  .toggle--vertical{
    display:inline-flex;
    flex-flow:column-reverse;

    .toggle__control{
      margin:.5em 0;
      transform:rotate(270deg);
    }
    
    .toggle__control:before,.toggle__control>*{
      align-self:normal;
    }
    
    .toggle__control:before{

      translate:0 25%;
    }
    
    .toggle__control:has(.toggle__indicator):before{
      translate:unset;
    }

    .toggle__control:after{
      
    }
  }
  .divider{
    align-self:stretch;

    border-color:var(--boundary--border-color);

    height:auto;
    inset:0;
    margin:.75rem .5rem;

    position:relative;
  }

    [be-divider-caption]:after{

      background:var(--divider--background);

      color:var(--font-color-alt-2);
      content:attr(be-divider-caption, "or");

      font-size:.8rem;
      inset:auto auto auto 50%;

      padding:.125rem .5rem;

      position:absolute;

      translate:-50% -50%;
    }

  .divider--vertical{
    border-width:0 1px 0 0;

    margin:.5rem 1rem;

    :where(&)[be-divider-caption]:after{
      inset:50% auto auto;
    }
  }

  .img--fluid,.img--thumbnail{
    display:block;
    height:auto;
    max-width:100%;
    max-width:-webkit-fill-available;
    width:100%;
  }

  .img--thumbnail{
    background:var(--background-color);
    
    border:0 var(--boundary--border-style) var(--boundary--border-color);
    border-radius:.375rem;
    border-width:var(--boundary--border-width);
    padding:.25em;
  }

  .img--fit-cover{
    object-fit:cover;
  }

  .img--fit-contain{
    object-fit:contain;
  }
  
  .img--fit-fill{
    height:100%;
    object-fit:fill;
  }
  .img--fit-fill,.video--fluid{
    display:block;
    width:100%;
  }
  .video--fluid{
    height:auto;
    max-width:100%;

    overflow:hidden;
    padding:0;

    position:relative;
  }

  .video--fluid:before{
    content:none;
  }

  .video--scale-4-3:before{
    padding-bottom:75%;
  }

  .video--scale-1-1:before{
    padding-bottom:100%;
  }
  .navbar{

    align-items:center;
    background:var(--navbar--background);
    display:flex;
    flex-flow:row wrap;

    & a{
      text-decoration:none;
    }

    >.nav>.nav__item>.nav{
      filter:var(--shadow-float-alt-1);
    }
    &:where([data-navbar-active]){
      &:is([data-navbar-active=true i]) .active-invisible{
        display:none;
      }
      
      &:not([data-navbar-active=true i]) .active-visible{
        display:none;
      }
    }
    
    &:has([data-toggle-navbar-handler]:checked) .active-invisible{
      display:none;
    }
    
    &:has([data-toggle-navbar-handler]:not(:checked)) .active-visible{
      display:none;
    }
  }

  .navbar__brand{
    display:inline-block;
    padding:.5rem 1rem;
    position:relative;
  }

  .navbar__toggle{
    opacity:0;
    overflow:clip;
    position:absolute;
    visibility:hidden;
    
    &:is(:focus,:focus-within){
      outline:var(--focus-outline);
    }
  }

  .nav{
    background:var(--nav--background, inherit);

    display:inline-flex;
    flex-flow:row wrap;

    list-style:none;
    
    padding:0;

    width:max-content;

    .nav{
      background:var(--nav__nav--background);

      display:none;
      flex-flow:column nowrap;
      inset:100% auto auto 0;

      margin:0;
      padding:0;

      position:absolute;

      transform:translateY(-.25rem);

      transition:display allow-discrete .2s,transform .2s ease-in-out;

      z-index:var(--z-index-popover);

      .nav{
        inset:0 auto auto 100%;
      }
    }
  }

  .nav__item-line:before{
    border:0 var(--boundary--border-style) var(--boundary--border-color);
    border-width:0 0 1px;
    content:"";

    display:block;
    height:0;
    padding:0;
  }

  .nav__item{
    flex:0 0 auto;
    padding:.5rem 1rem;
    position:relative;

    &:has(.nav)>a:after{
      border-bottom:.25em solid;
      border-left:.25em solid transparent;

      border-right:.25em solid transparent;
      content:"";
      display:inline-block;

      inset:auto auto .25em auto;
      margin:auto auto auto 1em;

      position:relative;
      transition:transform .35s ease-in-out;
    }

    &:hover{
      background:var(--background-color-active);
      
      &>a:after{
        transform:scaleY(-1);
        transform-origin:center;
      }
    }

    >*>.visual-indicator,>.visual-indicator{
      margin:0 0 0 1em;
      padding:0;

      transform:rotate(90deg) scaleX(-1);
      transition:transform .35s ease-in-out;
    }

    &:is(:hover,:focus,:focus-within){
      >*>.visual-indicator,>.visual-indicator{
        transform:rotate(90deg) scaleX(1);
      }

      >.nav{
        display:inline-flex;
        transform:translateY(0);

        @starting-style{
          transform:translateY(-.25rem);
        }
      }
    }
  }

  .navbar--no-indicator .nav__item>a:after{
    display:none;
  }

  .navbar--vertical{

    align-items:normal;
    flex-flow:column;

    .navbar__brand{
      padding:.5rem 1rem;
    }

    .nav{
      flex-flow:column;
      inset:0 auto auto 100%;
    }
  }

  .navbar--compact{
    justify-content:space-between;

    :where(.navbar__toggle){

      opacity:1;
      overflow:initial;
      position:static;
      visibility:visible;
    }

    >.nav{
      display:none;
      overflow:hidden;

      transition:display allow-discrete .2s,margin-top .2s ease-in-out;

      >.nav__item>.nav{
        filter:none;
      }

      >.nav__item:first-child{
        margin-top:-110%;

        transition:margin-top .35s ease-in-out;
      }
    }

    .nav{
      background:transparent;

      position:static;
      width:100%;

      .nav{
        display:none;
        margin:.5rem -1rem -.5rem;
        padding:0 0 0 1rem;

        transition:none;
        width:calc(100% + 2rem);
      }
    }

    .nav__item{
      .nav__item:first-child{
        margin:0;
      }

      .nav__item:last-child{
        padding:.5rem 1rem;
      }
      
      &:hover{
        filter:brightness(98%);
      }
    }

    &:not(.navbar--no-hover) .nav__item:hover,.nav__item:is(:focus,:focus-within){
      >.nav{
        display:block;
      }
    }

    &:has([data-toggle-navbar-handler]:checked),:where(&)[data-navbar-active=true i]{
      >.nav{
        display:block;

        >.nav__item:first-child{
          margin-top:0;
        
          @starting-style{
            margin-top:-110%;
          }
        }
      }
    }
  }
  .navbar--breadcrumb{
    --breadcrumb-divider:attr(be-breadcrumb-divider, "/");
    
    background:var(--navbar--breadcrumb--background, unset);
    
    gap:var(--navbar--breadcrumb-gap, 0 1.5rem);
    
    .navbar__brand{
      padding:0;
    }
    
    >.nav{
      background:unset;
      
      gap:var(--navbar--breadcrumb-gap, 0 1.5rem);
    }
    
    .navbar__brand:after,>.nav>.nav__item:not(:last-child):after{

      color:var(--font-color-alt-2);
      content:var(--breadcrumb-divider);
      position:absolute;
      right:-1rem;
    }

    >.nav>.nav__item{
      padding:0;
      &:hover{
        background:inherit;
      }
    }
  }
  .steps{
    gap:1rem;
    grid:max-content min-content / auto-flow 200px;

    list-style:none;
  }
  
  .step,.steps{
    display:grid;
  }
  
  .step{
    grid:subgrid [row-1-start] [row-1-end row-2-start] [row-2end] / subgrid [col];
    grid-area:span 2 / auto;

    text-align:center;
    
    z-index:1;
  }
  
  .step__header{
    display:flex;
    margin:.5rem;
  }

  .step__trail{
    align-items:center;

    display:flex;
    justify-content:center;
    position:relative;
    width:100%;

    &:after,&:before{
      background:var(--background-color-off);
      content:"";

      position:absolute;

      z-index:-1;
    }

    :where(.step:not(:last-child)) &:after{
      height:1px;
      transform:translate(50%);
      width:calc(100% + 2rem);
    }
  }

  .step__indicator{
    background:var(--background-color-off);

    border:0 var(--step__indicator--border-style, solid) var(--step__indicator--border-color);
    border-radius:50%;
      border-width:var(--step__indicator--border-width, 0);
    
    display:inline-flex;
    margin:initial;
    
    min-height:.5rem;
    min-width:.5rem;
    padding:initial;
    &:active,&:focus{
      filter:unset;
      transform:unset;
    }
    
    &:has(.visual-aside,.visual-indicator){
      padding:.25rem;
    }
    
    .visual-aside,.visual-indicator{
      translate:0;
    }
  }
  
  .step__body{
    color:var(--step__body--color);
    padding:.5rem;
  }

  .steps--vertical{
    grid:auto-flow min-content / min-content minmax(auto, 1fr);

    .step{
      grid-area:auto / span 2;
      text-align:left;
    }

    .step__header{
      justify-content:center;
    }

    .step__trail{
      align-items:baseline;
      justify-content:center;
      margin-top:.25lh;

      .step:not(:last-child) &:after{
        height:calc(100% + 2.5rem);
        transform:none;
        width:1px;
      }
    }
  }
  
  .step--active{
    .step:has(~&){
      .step__trail{
        &:after,&:before{
          background:var(--accent-color);
        }
      }
      
      .step__indicator{
        background:var(--accent-color);

        min-height:.75rem;
        min-width:.75rem;
      }

      .step__body{
        color:revert-layer;
      }
    }
    
    .step__trail:before{
      background:var(--accent-color);
    }
    
    .step__indicator{
      background:var(--background-color);

      border:0 var(--step--active_-step__indicator--border-style, solid) var(--accent-color);
      border-width:var(--step--active_-step__indicator--border-width, .125rem);

      min-height:.75rem;
      min-width:.75rem;
    }
    
    .step__body{
      color:revert-layer;
    }
  }
  
  .steps--done{
    .step__trail{
      &:after,&:before{
        background:var(--accent-color);
      }
    }
    
    .step__indicator{
      background:var(--accent-color);

      min-height:.75rem;
      min-width:.75rem;
    }
    
    .step__body{
      color:revert-layer;
    }
  }
  .tabs{
    display:flex;
    filter:var(--shadow-border);
    flex-flow:column nowrap;
    margin:auto auto 1rem;
  }

  .tabs__nav{
    border:0 var(--tabs__nav--border-style, solid) var(--tabs__nav--border-color);
      border-width:0;
    display:flex;
  }

  .tab__nav{

    background:var(--background-color-clickable);

    border:0 var(--boundary--border-style) var(--boundary--border-color);
    border-radius:.125rem .125rem 0 0;
    border-width:1px 1px 0;

    box-shadow:none;
    cursor:pointer;

    padding:.25rem .75rem;

    position:relative;
    
    &:is(&:focus,&:focus-within){
      box-shadow:none;
      outline:none;
      scale:none;
      text-decoration:underline 2px dashed var(--color-base-9);
    }
  }

  .tab__nav:has([data-tab-select-handler]:checked),.tab__nav[data-tab-active=true i]{
    background:var(--tab__nav--active--background);

    z-index:100;
  }

  .tabs__content{
    background:var(--tabs__content--background);

    border:0 var(--boundary--border-style) var(--boundary--border-color);
      border-width:1px;

    margin:-1px 0 0;
    padding:1rem;

    position:relative;

    z-index:99;
  }

  .tab__content{
    border:0 solid var(--boundary--border-color);

    display:none;
  }

  .tab__content[data-tab-active=true i],.tabs:has(.tab__nav:first-child [data-tab-select-handler]:checked) .tab__content:first-child,.tabs:has(.tab__nav:nth-child(10) [data-tab-select-handler]:checked) .tab__content:nth-child(10),.tabs:has(.tab__nav:nth-child(11) [data-tab-select-handler]:checked) .tab__content:nth-child(11),.tabs:has(.tab__nav:nth-child(12) [data-tab-select-handler]:checked) .tab__content:nth-child(12),.tabs:has(.tab__nav:nth-child(13) [data-tab-select-handler]:checked) .tab__content:nth-child(13),.tabs:has(.tab__nav:nth-child(14) [data-tab-select-handler]:checked) .tab__content:nth-child(14),.tabs:has(.tab__nav:nth-child(15) [data-tab-select-handler]:checked) .tab__content:nth-child(15),.tabs:has(.tab__nav:nth-child(2) [data-tab-select-handler]:checked) .tab__content:nth-child(2),.tabs:has(.tab__nav:nth-child(3) [data-tab-select-handler]:checked) .tab__content:nth-child(3),.tabs:has(.tab__nav:nth-child(4) [data-tab-select-handler]:checked) .tab__content:nth-child(4),.tabs:has(.tab__nav:nth-child(5) [data-tab-select-handler]:checked) .tab__content:nth-child(5),.tabs:has(.tab__nav:nth-child(6) [data-tab-select-handler]:checked) .tab__content:nth-child(6),.tabs:has(.tab__nav:nth-child(7) [data-tab-select-handler]:checked) .tab__content:nth-child(7),.tabs:has(.tab__nav:nth-child(8) [data-tab-select-handler]:checked) .tab__content:nth-child(8),.tabs:has(.tab__nav:nth-child(9) [data-tab-select-handler]:checked) .tab__content:nth-child(9){
    display:block;
  }

  .tabs--right{
    flex-flow:row-reverse nowrap;

    .tabs__nav{
      flex:0 0 auto;
      flex-flow:column;
    }

    .tab__nav{

      border-radius:0 .125rem .125rem 0;
      border-width:1px 1px 0 0;

      &:last-child{
        border-width:1px 1px 1px 0;
      }
    }

    .tabs__content{
      flex:1 0 auto;
      margin:0 -1px 0 0;
    }
  }

  .tabs--bottom{
    flex-flow:column-reverse nowrap;

    .tabs__nav{
      flex:0 0 auto;
      flex-flow:row;
    }

    .tab__nav{

      border-radius:0 0 .125rem .125rem;
      border-width:0 0 1px 1px;

      &:last-child{
        border-width:0 1px 1px;
      }
    }

    .tabs__content{
      flex:1 0 auto;
      margin:0 0 -1px;
    }
  }

  .tabs--left{
    flex-flow:row nowrap;

    .tabs__nav{
      flex:0 0 auto;
      flex-flow:column;
    }

    .tab__nav{

      border-radius:.125rem 0 0 .125rem;
      border-width:1px 0 0 1px;

      &:last-child{
        border-width:1px 0 1px 1px;
      }
    }

    .tabs__content{
      flex:1 0 auto;
      margin:0 0 0 -1px;
    }
  }
  [be-tooltip]{
    &:before{
      border-bottom:.4rem solid var(--background-color-text);

      border-left:.4rem solid transparent;
      border-right:.4rem solid transparent;
      content:"";
      inset:0 auto auto 50%;

      opacity:0;

      position:absolute;

      transform:scaleY(-1) translateX(-50%);

      transition:opacity .2s ease-in-out,inset .2s ease-in-out;

      z-index:1;
    }

    &:hover:before,&:is(.tooltip--focus):focus:before,&:is([data-tooltip-active=true i]):before{
      inset:-.5rem auto auto 50%;

      opacity:1;
    }

    &:after{

      background:var(--background-color-text);

      border-radius:.125rem;
      color:revert-layer;

      content:attr(be-tooltip);

      display:block;

      font-size:.7rem;
      inset:auto auto 100% 50%;

      max-width:clamp(200px, 100vw - 1.5rem, 50rem);

      opacity:0;
      overflow:hidden;
      padding:.25rem .5rem;
      pointer-events:none;

      position:absolute;
      text-overflow:ellipsis;

      transform:translateX(-50%);

      transition:opacity .2s ease-in-out,inset .2s ease-in-out;
      white-space:pre;
      z-index:var(--z-index-tooltip);
    }

    &:hover:after,&:is(.tooltip--focus):focus:after,&:is([data-tooltip-active=true i]):after{
      inset:auto auto calc(100% + .5rem) 50%;

      opacity:1;
    }

    &:disabled{
      pointer-events:auto;
    }
  }

  .tooltip--right{
    &:before{
      inset:50% auto auto calc(100% - .5rem);
      transform:rotate(-90deg);
      translate:0 -50%;
    }
    
    &:hover:before,&:is(.tooltip--focus):focus:before,&:is([data-tooltip-active=true i]):before{
      inset:50% auto auto 100%;
    }

    &:after{
      inset:50% auto auto 100%;

      transform:translateY(-50%);
    }

    &:hover:after,&:is(.tooltip--focus):focus:after,&:is([data-tooltip-active=true i]):after{
      inset:50% auto auto calc(100% + .55rem);
    }
  }

  .tooltip--bottom{
    &:before{
      inset:auto auto 0 50%;
      transform:rotate(0deg) translateX(-50%);
    }

    &:hover:before,&:is(.tooltip--focus):focus:before,&:is([data-tooltip-active=true i]):before{
      inset:auto auto -.5rem 50%;
    }

    &:after{
      inset:100% auto auto 50%;

      transform:translateX(-50%);
    }

    &:hover:after,&:is(.tooltip--focus):focus:after,&:is([data-tooltip-active=true i]):after{
      inset:calc(100% + .5rem) auto auto 50%;
    }
  }

  .tooltip--left{
    &:before{
      inset:50% calc(100% - .5rem) auto auto;
      transform:rotate(90deg);
      translate:0 -50%;
    }

    &:hover:before,&:is(.tooltip--focus):focus:before,&:is([data-tooltip-active=true i]):before{
      inset:50% 100% auto auto;
    }

    &:after{
      inset:50% 100% auto auto;
      transform:translateY(-50%);
    }
    
    &:hover:after,&:is(.tooltip--focus):focus:after,&:is([data-tooltip-active=true i]):after{
      inset:50% calc(100% + .55rem) auto auto;
    }
  }

  .tooltip--no-pointer{
    &:before{
      display:none;
    }

    &:hover:after{
      translate:0 .25rem;
    }

    &:is(.tooltip--right):hover:after{
      translate:-.25rem;
    }

    &:is(.tooltip--bottom):hover:after{
      translate:0 -.25rem;
    }

    &:is(.tooltip--left):hover:after{
      translate:.25rem;
    }
  }
  .dialog{
    display:grid;
    gap:.5rem 0;
    grid:"top-start top-middle top-end" auto "middle-start center middle-end" 1fr "bottom-start bottom-middle bottom-end" min-content / min-content;

    z-index:var(--z-index-modal);

    &:not([open],[popover]:popover-open){
        display:none;
    }
  }

  .dialog__header{
    align-items:center;

    display:flex;
    gap:var(--dialog__header--gap, .5rem);
    grid-area:auto / top-middle / auto / top-end;
    justify-content:space-between;

    &>:where(h1,h2,h3,h4,h5,h6){
      margin:0;
    }
  }

  .dialog__aside{

    align-content:flex-start;
    grid-area:top-start / auto / bottom-start / auto;

    padding:.25rem;
    text-align:center;
  }

  .dialog__content{
    grid-area:auto / center / auto / bottom-end;

      overflow:auto;
  }

  .dialog__footer{
    grid-area:auto / bottom-middle / auto / bottom-end;
  }
  
  .dialog--md{
    height:clamp(13rem, 100vh - 2rem, 458px);
    width:clamp(280px, 100vw - 4rem, 590px);
  }
  
  .dialog--lg{
    height:clamp(13rem, 100vh - 4rem, 796px);
    width:clamp(280px, 100vw - 4rem, 1024px);
  }
  .notice{
    
    background:var(--notice--background-color);
    
    border:0 var(--notice--border-style, solid) var(--notice--border-color);
    border-radius:var(--notice--border-radius, .125rem);
      border-width:var(--notice--border-width, 1px);
    
    box-shadow:var(--notice--box-shadow, );
    color:var(--notice--color, revert-layer);
    
    display:flex;
    flex-flow:var(--notice--flex-flow, row wrap);
    gap:.5rem;
    
    margin:auto auto 1rem;
    padding:1rem;
    
    position:relative;
    
    text-align:initial;
  }

  .notice__header{
    
    display:block;
    flex:1 1 100%;
    font-size:1.25rem;
  }

  .notice__aside{
  }

  .notice__content{
    
    align-content:space-evenly;
    flex:1 1 0;
      
    overflow-y:auto;
  }

  .notice__footer{
  }

  .notice--accent{
    background:var(--accent-color);
    border-color:var(--accent-color);
    color:#fff;
    
    .notice__aside{
      color:var(--accent-color);
    }
  }

  .notice--low{
    background:var(--color-low-10);
    border-color:var(--color-low-20);
    
    .notice__aside{
      color:var(--color-low-80);
    }
  }

  .notice--normal{
    background:var(--color-normal-10);
    border-color:var(--color-normal-20);
    
    .notice__aside{
      color:var(--color-normal-80);
    }
  }

  .notice--important{
    background:var(--color-important-10);
    border-color:var(--color-important-20);
    
    .notice__aside{
      color:var(--color-important-80);
    }
  }

  .notice--critical{
    background:var(--color-critical-10);
    border-color:var(--color-critical-20);
    
    .notice__aside{
      color:var(--color-critical-80);
    }
  }

  .notice--success{
    background:var(--color-success-10);
    border-color:var(--color-success-20);
    
    .notice__aside{
      color:var(--color-success-80);
    }
  }

  .notice--info{
    background:var(--color-info-10);
    border-color:var(--color-info-20);
    
    .notice__aside{
      color:var(--color-info-80);
    }
  }

  .notice--caution{
    background:var(--color-caution-10);
    border-color:var(--color-caution-20);
    
    .notice__aside{
      color:var(--color-caution-80);
    }
  }

  .notice--warning{
    background:var(--color-warning-10);
    border-color:var(--color-warning-20);
    
    .notice__aside{
      color:var(--color-warning-80);
    }
  }

  .notice--error{
    background:var(--color-error-10);
    border-color:var(--color-error-20);
    
    .notice__aside{
      color:var(--color-error-80);
    }
  }

  .notice--danger{
    background:var(--color-danger-10);
    border-color:var(--color-danger-20);
    
    .notice__aside{
      color:var(--color-danger-80);
    }
  }
  .notice--notify{
    background:var(--color-base-5);
      
    border:0 var(--notice--notify--border-style, solid) var(--notice--border-color);
    border-radius:var(--notice--notify--border-radius, .125rem);
      border-width:var(--notice--notify--border-width, 0);
    
    box-shadow:var(--shadow-float);

    display:none;
    flex-flow:row nowrap;
    
    height:auto;
    inset:auto auto 0 50%;
    max-height:40vh;
    max-width:clamp(250px, 100vw - 3rem, 992px);

    min-width:250px;
    opacity:0;
    padding:0 .5rem;

    position:fixed;
    transform:translate(-50%) scale(.85);
    transition:opacity .35s ease-in-out,transform .35s ease-in-out,overlay allow-discrete .35s,display allow-discrete .35s;
    width:max-content;
    
    z-index:var(--z-index-popover);
    &[data-notify-active]{
      display:flex;
      opacity:1;
      transform:translate(-50%) scale(1);

      @starting-style{
        opacity:0;
        transform:translate(-50%) scale(.85);
      }
    }
    
    .notice__aside{
      align-content:center;
    }
    
    .notice__content,.notice__footer{
      margin:.5rem 0;
    }
    
    &.notice--accent{
      background:var(--accent-color);
    }
        
    &.notice--low{
      background:var(--color-low-5);
      border-color:var(--color-low-10);
    }

    &.notice--normal{
      background:var(--color-normal-5);
      border-color:var(--color-normal-10);
    }

    &.notice--important{
      background:var(--color-important-5);
      border-color:var(--color-important-10);
    }

    &.notice--critical{
      background:var(--color-critical-5);
      border-color:var(--color-critical-10);
    }

    &.notice--success{
      background:var(--color-success-5);
      border-color:var(--color-success-10);
    }

    &.notice--info{
      background:var(--color-info-5);
      border-color:var(--color-info-10);
    }

    &.notice--caution{
      background:var(--color-caution-5);
      border-color:var(--color-caution-10);
    }

    &.notice--warning{
      background:var(--color-warning-5);
      border-color:var(--color-warning-10);
    }

    &.notice--error{
      background:var(--color-error-5);
      border-color:var(--color-error-10);
    }

    &.notice--danger{
      background:var(--color-danger-5);
      border-color:var(--color-danger-10);
    }
  }
  .popper-container{
    display:inline-flex;
    position:relative;
  }

  .popper{
    background:var(--popper--background);

    border:0 var(--popper--border-style, solid) var(--popper--border-color);
    border-radius:var(--popper--border-radius, .125rem);
      border-width:var(--popper--border-width, 1px);

    filter:var(--shadow-float-alt-1);
    inset:auto auto calc(100% + .25rem*var(--popper-space)) 50%;

    max-height:75vh;
    max-width:clamp(200px, 100vw - 5rem, 816px);
    min-width:5rem;

    padding:1rem;

    position:absolute;

    translate:-50%;
    width:max-content;
    z-index:var(--z-index-popover);

    &:before{
      content:"";

      height:calc(100% + 1rem*var(--popper-space));
      inset:calc(-.5rem*var(--popper-space)) auto auto calc(-.5rem*var(--popper-space));
      position:absolute;
      width:calc(100% + 1rem*var(--popper-space));
      z-index:-1;
    }

    @media screen and (max-height:576px){
      &{
        max-height:calc(100vh - 5rem);
      }
    }
  }

  .popper--list{
    .popper__content{
      display:flex;
      flex-flow:column nowrap;
      margin:-1rem;
      padding:.25rem;
    }
  }

  .popper__content{
    height:100%;
    max-height:inherit;
    overflow-x:hidden;

    overflow-y:auto;
  }

  .popper__item{
    border:none;
    border-radius:unset;
    box-shadow:none;
    margin:0;
    outline:none;
    padding:.25rem 1rem;
    
    text-align:left;
    width:100%;
    
    :where(&){
      background:inherit;
    }
    
    &:focus{
      box-shadow:none;
      text-decoration:underline 2px dashed var(--color-base-9);
    }

    &:focus,&:hover{
      scale:none;
    }
    
    &:is(a,button,.btn):hover{
      filter:brightness(103%);
    }
  }

  .popper__line{
    z-index:1;
    
    &:before{
      border:0 var(--boundary--border-style) var(--boundary--border-color);
      border-width:0 0 1px;
      content:"";

      display:block;
      height:0;
      padding:0;
    }
  }

  .popper--tl{
    inset:auto auto calc(100% + .25rem*var(--popper-space)) 0;
    translate:0;
  }

  .popper--tr{
    inset:auto 0 calc(100% + .25rem*var(--popper-space)) auto;
    translate:0;
  }

  .popper--bl{
    inset:calc(100% + .25rem*var(--popper-space)) auto auto 0;
    translate:0;
  }

  .popper--bm{
    inset:calc(100% + .25rem*var(--popper-space)) auto auto 50%;
  }

  .popper--br{
    inset:calc(100% + .25rem*var(--popper-space)) 0 auto auto;
    translate:0;
  }

  .popper--lt{
    inset:0 calc(100% + .25rem*var(--popper-space)) auto auto;
    translate:0;
  }

  .popper--lm{
    inset:50% calc(100% + .25rem*var(--popper-space)) auto auto;
    translate:0 -50%;
  }

  .popper--lb{
    inset:auto calc(100% + .25rem*var(--popper-space)) 0 auto;
    translate:0;
  }

  .popper--rt{
    inset:0 auto auto calc(100% + .25rem*var(--popper-space));
    translate:0;
  }

  .popper--rm{
    inset:50% auto auto calc(100% + .25rem*var(--popper-space));
    translate:0 -50%;
  }

  .popper--rb{
    inset:auto auto 0 calc(100% + .25rem*var(--popper-space));
    translate:0;
  }

  .popper--pointer{
    &:after{
      border-bottom:.5rem solid var(--background-color);

      border-left:.5rem solid transparent;
      border-right:.5rem solid transparent;
      content:"";
      inset:auto auto -.375rem 50%;

      opacity:1;

      position:absolute;

      transform:rotate(180deg);
      translate:-50%;
    }

    &:is(.popper--tl):after{
      inset:auto auto -.375rem .8rem;
      translate:0;
    }

    &:is(.popper--tr):after{
      inset:auto .8rem -.375rem auto;
      translate:0;
    }

    &:is(.popper--bl):after{
      inset:-.375rem auto auto .8rem;
      transform:rotate(0deg);
      translate:0;
    }

    &:is(.popper--bm):after{
      inset:-.375rem auto auto 50%;
      transform:rotate(0deg);
      translate:-50%;
    }

    &:is(.popper--br):after{
      inset:-.375rem .8rem auto auto;
      transform:rotate(0deg);
      translate:0;
    }

    &:is(.popper--lt):after{
      inset:.8rem -.65rem auto auto;
      transform:rotate(90deg);
      translate:0;
    }

    &:is(.popper--lm):after{
      inset:50% -.65rem auto auto;
      transform:rotate(90deg);
      translate:0 -50%;
    }

    &:is(.popper--lb):after{
      inset:auto -.65rem .8rem auto;
      transform:rotate(90deg);
      translate:0;
    }

    &:is(.popper--rt):after{
      inset:.8rem auto auto -.65rem;
      transform:rotate(-90deg);
      translate:0;
    }

    &:is(.popper--rm):after{
      inset:50% auto auto -.65rem;
      transform:rotate(-90deg);
      translate:0 -50%;
    }

    &:is(.popper--rb):after{
      inset:auto auto .8rem -.65rem;
      transform:rotate(-90deg);
      translate:0;
    }
  }

  .popper{
    display:none;
    opacity:0;
    transform:translateY(calc(.25rem*var(--popper-space)));
    transition:display allow-discrete .2s,opacity .2s ease-in-out,transform .2s ease-in-out;

    &:is(.popper--bl,.popper--bm,.popper--br){
      transform:translateY(calc(-.25rem*var(--popper-space)));
    }

    &:is(.popper--lt,.popper--lm,.popper--lb){
      transform:translateX(calc(.25rem*var(--popper-space)));
    }

    &:is(.popper--rt,.popper--rm,.popper--rb){
      transform:translateX(calc(-.25rem*var(--popper-space)));
    }

    &:focus,&:focus-within,&:hover,&[data-popper-active=true i],:has(+.popper--focus):focus+&,:has(+.popper--hover):hover+&{
      display:block;
      opacity:1;
      transform:translateY(0);
      @starting-style{
        opacity:0;
        transform:translateY(calc(.25rem*var(--popper-space)));

        &:is(.popper--bl,.popper--bm,.popper--br){
          transform:translateY(calc(-.25rem*var(--popper-space)));
        }

        &:is(.popper--lt,.popper--lm,.popper--lb){
          transform:translateX(calc(.25rem*var(--popper-space)));
        }

        &:is(.popper--rt,.popper--rm,.popper--rb){
          transform:translateX(calc(-.25rem*var(--popper-space)));
        }
      }
    }
  }
  .panel{
    display:flex;
    flex-flow:column nowrap;
    
    gap:.5rem;
  }
  
  .panel,.panel__body,.panel__header{
    padding:.5rem;
  }
  
  .panel__body{

    overflow:auto;
  }
    
  :where(.panel__header,.panel__body)>*{
    margin:unset
  }
  .floater{
    
    height:auto;
    max-width:clamp(280px, calc(100% - 2rem), 640px);

    min-width:280px;
    position:fixed;
    width:max-content;

    z-index:var(--z-index-fixed);
    
    @media screen and (max-height:576px){
      &{
        max-height:calc(100% - 2rem);
      }
    }

    @media screen and (min-height:576px){
      &{
        max-height:80vh;
      }
    }

    @media screen and (max-width:576px){
      &{
        max-width:100%;
      }
    }
  }
  
  .floater--top{
    inset:0 50% auto;
    transform:translate(-50%);
  }
  
  .floater--top-left{
    inset:0 auto auto 0;
    transform:none;
  }

  .floater--top-right{
    inset:0 0 auto auto;
    transform:none;
  }

  .floater--bottom{
    inset:auto 50% 0;
    transform:translate(-50%);
  }

  .floater--bottom-right{
    inset:auto 0 0 auto;
    transform:none;
  }

  .floater--bottom-left{
    inset:auto auto 0 0;
    transform:none;
  }
  
  @media screen and (max-width:816px){
    .floater--top,.floater--top-left,.floater--top-right{
      inset:0 50% auto;
      transform:translate(-50%);
    }
    
    .floater--bottom,.floater--bottom-left,.floater--bottom-right{
      inset:auto 50% 0;
      transform:translate(-50%);
    }
  }
    
  .floater--md{
      height:clamp(13rem, 100vh - 2rem, 474px);
      width:clamp(280px, 100vw - 2rem, 610px);
  }

  .floater--lg,.floater--md{
      max-height:revert-layer;
      max-width:revert-layer;
  }

  .floater--lg{
      height:clamp(13rem, 100vh - 2rem, 902px);
      width:clamp(280px, 100vw - 2rem, 1160px);
  }

  .floater--fluid{
      max-height:calc(100vh - 2rem);
      max-width:calc(100vw - 2rem);
      max-width:revert-layer;
  }
  
  .floater:where([popover]){
    
    display:block;
    inset:0;
    min-width:auto;
    opacity:1;
    pointer-events:auto;
    
    position:fixed;
    
    transition:transform .35s ease-in-out,display allow-discrete .35s;
    
    z-index:1;
        
    &:not([popover]:popover-open){
      box-shadow:none;
      
      height:100%;
      max-height:unset;
      max-width:unset;
      
      overflow:clip;
      
      position:relative;
      transform:translate(-50%, -50%);
      
      translate:50% 50%;
      width:auto;
      
      .active-visible{

        opacity:0;
        overflow:clip;
        position:absolute;
      }
    }
  }
  
  .floater[popover]:popover-open{
    inset:50% auto auto 50%;
    position:fixed;
    transform:translate(-50%, -50%) scale(1.01);
    
    .active-invisible{

      opacity:0;
      overflow:clip;
      position:absolute;
    }
  }
  .appear{
    display:grid;
    grid:0fr / 100%;
    
    max-height:40vh;

    transition:grid .35s ease-in-out,visibility .35s ease-in-out;

    visibility:collapse;

    &:has(>:where([data-appear-handler]:checked)),&:where([data-appear-active=true i]){
      grid:1fr / 100%;
      
      visibility:visible;
      
      .appear__content{
        overflow:auto;
        scrollbar-width:auto;
      }
    }
  }

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

  .appear__overflow{
    overflow:hidden;
  }

  .appear__content{
    height:100%;
    overflow:clip;
    scrollbar-width:none;
    transition:scrollbar-width allow-discrete 1.5s;
  }

  .appear__toggle{
    inset:0;
    position:absolute;

    z-index:-1;
  }

  .appear--right{
    grid:100% / auto 0fr;
    max-height:none;
    max-width:40vw;

    [data-appear-handler]{
      position:static;
    }

    &:has(>[data-appear-handler]:checked),&:where([data-appear-active=true i]){
      grid:100% / auto 1fr;
    }
  }

  .appear--bottom{
    grid:auto 0fr / 100%;

    [data-appear-handler]{
      position:static;
    }

    &:has(>[data-appear-handler]:checked),&:where([data-appear-active=true i]){
      grid:auto 1fr / 100%;
    }
  }

  .appear--left{
    grid:100% / 0fr;
    max-height:none;
    max-width:40vw;

    &:has(>[data-appear-handler]:checked),&:where([data-appear-active=true i]){
      grid:100% / 1fr;
    }
  }

  .appear--fix{
    grid:0 / 100%;
    max-height:none;

    .appear__content{
    }

    &:has(>[data-appear-handler]:checked),&:where([data-appear-active=true i]){
      grid:var(--appear-size) / 100%;
    }

    &:is(.appear--right){
      grid:100% / auto 0;
      max-width:none;

      .appear__content{
        height:100%;
        width:var(--appear-size);
      }

      &:has(>[data-appear-handler]:checked),&:where([data-appear-active=true i]){
        grid:100% / auto var(--appear-size);
      }
    }

    &:is(.appear--bottom){
      grid:auto 0 / 100%;

      &:has(>[data-appear-handler]:checked),&:where([data-appear-active=true i]){
        grid:auto var(--appear-size) / 100%;
      }
    }

    &:is(.appear--left){
      grid:100% / 0;
      max-width:none;

      .appear__content{
        height:100%;
        width:var(--appear-size);
      }

      &:has(>[data-appear-handler]:checked),&:where([data-appear-active=true i]){
        grid:100% / var(--appear-size);
      }
    }
  }
  .appear--offcanvas{
    backdrop-filter:blur(1px);

    background:var(--backdrop--background);

    display:initial;
    inset:0;

    max-height:none;
    max-width:none;
    position:fixed;

    transition:visibility .35s ease-in-out;

    z-index:var(--z-index-offcanvas);

    .appear__content{
      background:var(--appear--offcanvas_-appear__content--background);

      box-shadow:var(--shadow-float);
      height:auto;
      max-height:40vh;

      min-height:50px;
      position:absolute;

      transition:translate .35s ease-in-out;

      translate:0 -10%;

      width:100%;
    }

    &:has(>[data-appear-handler]:checked),&:where([data-appear-active=true i]){
      visibility:visible;

      .appear__content{
        translate:0;
      }
    }

    &:is(.appear--right) .appear__content{
      height:100%;
      inset:0 0 0 auto;
      max-height:100%;
      max-width:40vw;
      min-width:275px;
      translate:100%;
      width:auto;
    }

    &:is(.appear--bottom) .appear__content{
      inset:auto 0 0 0;
      translate:0 100%;
    }

    &:is(.appear--left) .appear__content{
      height:100%;
      inset:0 auto 0 0;
      max-height:100%;
      max-width:40vw;
      min-width:275px;
      translate:-10%;
      width:auto;
    }

    &:is(.appear--fix){
      .appear__content{
        height:var(--appear-size);
        max-height:none;
        max-width:none;
        min-height:auto;
        min-width:auto;
      }

      &:is(.appear--right) .appear__content{
        height:100%;
        width:var(--appear-size);
      }

      &:is(.appear--bottom) .appear__content{
        height:var(--appear-size);
      }

      &:is(.appear--left) .appear__content{
        height:100%;
        width:var(--appear-size);
      }
    }
  }

  .appear--no-backdrop{
    inset:0 0 auto 0;

    &:is(.appear--right){
      inset:0 0 0 auto;
    }

    &:is(.appear--bottom){
      inset:auto 0 0 0;
    }

    &:is(.appear--left){
      inset:0 auto 0 0;
    }
  }

  html:has(:where(.appear--offcanvas,.appear--offcanvas-vsm,.appear--offcanvas-vmd,.appear--offcanvas-vlg):not(.appear--no-backdrop)>[data-appear-handler]:checked,.appear:where([data-appear-active=true i]):not(.appear--no-backdrop)){
    overflow:hidden;
  }
  .accordions{
    background:var(--accordions--background);
    border-radius:.125rem;
    display:flex;

    height:var(--accordions--height);

    margin:0 0 1rem;
  }

  .accordion{
    border:0 var(--accordion--border-style, solid) var(--accordion--border-color);
    display:flex;
    flex:0;
    min-width:min-content;
    transition:flex-basis .35s ease-in-out;

    &:first-child{
      border-bottom-left-radius:inherit;
      border-top-left-radius:inherit;
      border-width:var(--accordion-first-child--border-width, 1px 0 1px 1px);
    }

    &:last-child{
      border-bottom-right-radius:inherit;
      border-top-right-radius:inherit;
      border-width:var(--accordion-last-child--border-width, 1px 1px 1px 0);
    }

    &:not(:first-child,:last-child){
      border-width:var(--accordion--border-width, 1px 1px 1px 1px);
    }

    &:has(>.accordion__header [data-accordion-select-handler]:checked),&:where([data-accordion-active=true i]){
        flex:1 1 100%;
        
        .accordion__content{
          overflow:auto;
          scrollbar-width:auto;
        }
    }

    &:has(>.accordion__header [type=checkbox]){
      transition:flex-grow .35s ease-in-out,flex-basis .35s ease-in-out;
    }
  }

  .accordion__header{
    align-items:baseline;
    background:var(--accordion__header--background);
    border:0 var(--accordion__header--border-style, solid) var(--accordion__header--border-color);
      border-width:0 1px 0 0;

    color:var(--accordion__header--color, revert-layer);
    cursor:pointer;
    display:flex;

    justify-content:space-between;
    margin:0 -1px 0 0;

    padding:1rem .5em;

    position:relative;

    writing-mode:tb;

    :where(&:focus,&:focus-within){
      text-decoration:underline 2px dashed var(--color-base-9);
    }

    >.visual-indicator{
      transition:transform .35s ease-in-out;
    }

    &:has([data-accordion-select-handler]:checked)>.visual-indicator{
      transform:scaleX(-1);
    }
  }

  .accordion__body{
    background:var(--accordion__body--background, initial);
    color:var(--accordion__body--color, revert-layer);
    display:flex;
    flex:1 1 100%;
  }

  .accordion__overflow{
    overflow:hidden;
    position:relative;
    width:100%;
  }

  .accordion__content{
    inset:0;
    overflow:clip;
    overscroll-behavior:contain;
    padding:1rem;
    position:absolute;
    scrollbar-width:none;
    transition:scrollbar-width allow-discrete 1.5s;
  }

  .accordions--vertical{
    flex-flow:column nowrap;

    >.accordion{
      flex-flow:column nowrap;
      min-width:auto;

      transition:none;

      &:first-child{
        border-radius:unset;
        border-bottom-left-radius:inherit;
        border-top-left-radius:inherit;
        border-width:var(--accordion-first-child--border-width, 1px 1px 0 1px);
      }

      &:last-child{
        border-radius:unset;
        border-bottom-right-radius:inherit;
        border-top-right-radius:inherit;
        border-width:var(--accordion-last-child--border-width, 0 1px 1px 1px);
      }

      &:not(:first-child,:last-child){
        border-width:var(--accordion--border-width, 1px 1px 1px 1px);
      }
    }

    .accordion__header{
      border-width:0 0 1px;
      margin:0 0 -1px;

      padding:.5rem 1em;

      writing-mode:initial;

      .visual-indicator{
        transform:rotate(90deg);
      }

      &:has([data-accordion-select-handler]:checked) .visual-indicator{
        transform:rotate(90deg) scaleX(-1);
      }
    }

    .accordion__body{
      display:grid;
      grid:0fr / auto;

      transition:grid .35s ease-in-out,visibility .35s ease-in-out;
      visibility:hidden;

      .accordion:has(>.accordion__header [data-accordion-select-handler]:checked)>&{
        grid:1fr / auto;
        visibility:visible;
      }
    }

    &.accordions--vertical-height-auto{
      height:auto !important;

      .accordion__content{
        position:static;
      }
    }
  }
  .card{
    background:var(--card--background);

    display:grid;
    
    filter:var(--shadow-border);
    gap:1rem;
    grid:[row-1] minmax(1rem, max-content) [row-2] auto [row-3] min-content / auto;

    margin:auto auto 1rem;
    padding:1rem;
  }
  
  .card__content{
    display:grid;
    grid:subgrid [row-1-start] [row-1-end row-2-start] [row-2end row-3-start] [row-3-end] / subgrid [col];
    grid-area:1 / 1 / -1 / -1;
    grid-auto-flow:inherit;
  }

  .card__media{
    &>img{

      display:block;
      height:100%;

      object-fit:cover;
      width:100%;
    }
  }

  .card__header{
    grid-area:2 / auto;
  }

  .card__body{
    grid-area:3 / auto;
  }

  :where(.card,.card__media,.card__header,.card__body)>*{
    margin-left:unset;
    margin-right:unset;
    
    &:first-child{
      margin-top:unset;
    }
    
    &:last-child{
      margin-bottom:unset;
    }
  }

  .cards{
    display:grid;
    gap:1.25rem;
    grid:auto-flow minmax(auto, 300px) min-content min-content / repeat(auto-fit, minmax(auto, 350px));

    justify-content:center;
    
    >.card{
      grid:subgrid [row-1-start] [row-1-end row-2-start] [row-2end row-3-start] [row-3-end] / subgrid [col];
      grid-area:span 3 / auto;
      margin:unset;
    }
  }
  
  .cards--media-sticks-to-border{
    .card__media:first-child{
      margin:-1rem -1rem 0;
    }

    .card__media:last-child{
      margin:0 -1rem -1rem;
    }
  }
  
  .cards--cover{
    grid:auto-flow minmax(min-content, 150px) min-content min-content / repeat(auto-fit, minmax(auto, 300px));
    
    .card__media{
      grid-area:1 / 1 / -1 / -1;
      margin:-1rem;
    }
  }
  
  .cards--horizontal{
    grid:auto-flow minmax(min-content, auto) / repeat(auto-fill, minmax(auto, 280px) minmax(auto, 280px));

    justify-content:center;

    >.card{
      grid:subgrid / subgrid;
      grid-area:span 3 / span 2;
      grid-auto-flow:column;
    }
    
    .card__content:is(:first-child):not(:last-child){
      grid-area:1 / auto / -1;
    }
    
    .card__content:is(:last-child):not(:first-child){
      grid-area:1 / 2 / -1;
    }
    
    .card__header{
      grid-area:1 / auto;
    }

    .card__body{
      grid-area:span 2 / auto;
    }
    
    .card__media:first-child{
      grid-area:1 / auto / -1;
    }
    
    .card__media:last-child{
      grid-area:1 / 2 / -1;
    }
      
    .cards--media-sticks-to-border:is(&){
      .card__media{
        &:first-child{
          margin:-1rem -.5rem -1rem -1rem;
        }

        &~*{
          margin:0 0 0 .5rem;
        }

        &:last-child{
          margin:-1rem -1rem -1rem -.5rem;
        }

        :has(~&){
          margin:0 .5rem 0 0;
        }
      }
    }
  }
  
  .cards--auto-fit{
    &:has(>:nth-child(3)){
        grid:auto-flow minmax(auto, 300px) min-content min-content / repeat(auto-fit, minmax(280px, 1fr));
    }
    
    &:where(.cards--cover):has(>:nth-child(3)){
      grid:auto-flow minmax(auto, 150px) min-content min-content / repeat(auto-fit, minmax(300px, 1fr));
    }
  }
  .cards--scrollable,.cards--slide{
    
    grid:minmax(min-content, auto) minmax(min-content, 1fr) minmax(min-content, auto) / auto-flow minmax(280px, 1fr);
    
    justify-content:normal;
    
    overflow:auto;
    padding:.5rem;
    scroll-behavior:smooth;
    -ms-scroll-snap-type:x mandatory;
    scroll-snap-type:x mandatory;
    
    >.card{
      grid:subgrid / subgrid;
      
      position:relative;
      scroll-margin:.5rem;
      
      scroll-snap-align:start;
    }
  }
  .cards--slide{
    
    grid:60vh minmax(min-content, auto) minmax(min-content, auto) / auto-flow minmax(50%, 1fr) minmax(50%, 1fr);
    grid:40vh minmax(min-content, auto) minmax(min-content, auto) / auto-flow minmax(40%, 1fr) minmax(40%, 1fr);
    height:var(--cards--slide--height);
    
    scrollbar-width:none;
    [data-slide-select-handler]{
      inset:0 50%;
      position:absolute; 
    }
    
    &:has([data-slide-select-handler]:focus){
      box-shadow:0 0 0 .125rem var(--transparent-color);
    }
    
    .card{
      box-shadow:unset;
      grid:subgrid / subgrid;
      
      grid-area:span 3 / span 2;
      margin:0 .5rem;
      scroll-margin:initial;
      
      scroll-snap-align:center;
    }
    
    .card__content{
      background:var(--background-color-text);
      grid:auto / auto;
      
      grid-area:2 / 1 / -1 / -1;
      
      height:fit-content;
      margin:0 auto;
      max-width:clamp(280px, 100% - 2rem, 65rem);
      min-width:280px;
      min-width:fit-content;
      padding:1rem;
      
      .card__header{
        grid-area:1 / 1 / 1 / -1;
      }
      
      .card__body{
        grid-area:2 / 1 / 2 / -1;
      }
    }
    
    .card__media{
      grid-area:1 / 1 / 1 / -1;
      
      img{
        object-fit:contain;
      }
    }
    
    .card__header{
      grid-area:2 / 1 / 2 / -1;
    }
    
    .card__body{
      grid-area:3 / 1 / 3 / -1;
    }
    
  }
  
  .cards--horizontal-nav{
    &::scroll-button(*){

      background:var(--background-color-clickable);
      border:0 var(--slide__navigators--border-style, solid) var(--slide__navigators--border-color, var(--border-color-control));
      border-radius:var(--slide__navigators--border-radius, .25rem);
        border-width:var(--slide__navigators--border-width, 1px);

      box-shadow:var(--btn--shadow);

      color:var(--controls--color);
      cursor:pointer;
      
      line-height:1;
      
      margin:1rem 0;
      padding:.5rem .75rem;
      
      z-index:1;
    }
    
    &::scroll-button(left){
      content:var(--slide-prev-nav);
    }

    &::scroll-button(right){
      content:var(--slide-next-nav);
      
      margin-left:.5rem;
    }
    
    &::scroll-button(*):not(:disabled):active{
      box-shadow:none;
      transform:translateY(1px);
    }

    &::scroll-button(*):focus-visible{
      box-shadow:none;
      outline:var(--focus-outline);
    }
    
    &::scroll-button(*):not(:disabled):hover{
      
    }
    
    &::scroll-button(*):disabled{
      cursor:not-allowed;
      filter:contrast(.5);
    }
  }
  .slide{
    position:relative;
    
    :where(&) .cards--horizontal-nav{
      &::scroll-button(*){
        
        margin:initial;
        position:absolute;
        
        translate:0 -50%;
        
        z-index:1;
      }
        
      &::scroll-button(left){
        inset:50% auto auto .5rem;
      }

      &::scroll-button(right){
        inset:50% .5rem auto auto;
      }
    }
  }

  .slide__item,.slide__items{
    
  }

  .slide__navigator-next,.slide__navigator-prev{

    background:var(--background-color-clickable);

    border:0 var(--slide__navigators--border-style, solid) var(--slide__navigators--border-color, var(--border-color-control));
    border-radius:var(--slide__navigators--border-radius, .25rem);
      border-width:var(--slide__navigators--border-width, 1px);
    cursor:pointer;

    line-height:1;

    padding:.5rem;
    
    position:absolute;
  }

  .slide__navigator-prev{
    inset:40% auto auto .5rem;
  }

  .slide__navigator-next{
    inset:40% .5rem auto auto;
  }

  .slide__indicators{
    display:flex;
    gap:.5rem .5rem;

    justify-content:center;

    margin:1rem;
  }

  .slide__indicator-item{
    
    background:var(--slide__indicator-item--background, var(--background-color-clickable));

    border:0 var(--slide__indicator-item--border-style, solid) var(--slide__indicator-item--border-color);
    border-radius:var(--slide__indicator-item--border-radius, .25rem);
      border-width:var(--slide__indicator-item--border-width, 1px);
    cursor:pointer;

    height:.375rem;
    width:1.75rem;

    &:focus,&:hover{
      box-shadow:revert-layer;
    }
  }

  .slide:has(.slide__item:first-child [data-slide-select-handler]:checked) .slide__indicator-item:first-child,.slide:has(.slide__item:nth-child(10) [data-slide-select-handler]:checked) .slide__indicator-item:nth-child(10),.slide:has(.slide__item:nth-child(11) [data-slide-select-handler]:checked) .slide__indicator-item:nth-child(11),.slide:has(.slide__item:nth-child(12) [data-slide-select-handler]:checked) .slide__indicator-item:nth-child(12),.slide:has(.slide__item:nth-child(13) [data-slide-select-handler]:checked) .slide__indicator-item:nth-child(13),.slide:has(.slide__item:nth-child(14) [data-slide-select-handler]:checked) .slide__indicator-item:nth-child(14),.slide:has(.slide__item:nth-child(15) [data-slide-select-handler]:checked) .slide__indicator-item:nth-child(15),.slide:has(.slide__item:nth-child(2) [data-slide-select-handler]:checked) .slide__indicator-item:nth-child(2),.slide:has(.slide__item:nth-child(3) [data-slide-select-handler]:checked) .slide__indicator-item:nth-child(3),.slide:has(.slide__item:nth-child(4) [data-slide-select-handler]:checked) .slide__indicator-item:nth-child(4),.slide:has(.slide__item:nth-child(5) [data-slide-select-handler]:checked) .slide__indicator-item:nth-child(5),.slide:has(.slide__item:nth-child(6) [data-slide-select-handler]:checked) .slide__indicator-item:nth-child(6),.slide:has(.slide__item:nth-child(7) [data-slide-select-handler]:checked) .slide__indicator-item:nth-child(7),.slide:has(.slide__item:nth-child(8) [data-slide-select-handler]:checked) .slide__indicator-item:nth-child(8),.slide:has(.slide__item:nth-child(9) [data-slide-select-handler]:checked) .slide__indicator-item:nth-child(9),.slide__indicator-item:where([data-slide-active=true i]){
    background:var(--slide__indicator-item--active--background, var(--background-color-off));
    
    border:0 var(--slide__indicator-item--active--border-style, solid) var(--slide__indicator-item--active--border-color);
      border-width:var(--slide__indicator-item--active--border-width, 0);
  }
  .group,.group-vertical{
    align-items:baseline;
    display:flex;
  }

  .group-vertical{
    align-items:stretch;
    flex-flow:column;
  }

  .group__action,.group__input,.group__label{
    border-radius:unset;

    border-width:0;

    box-shadow:none;
    flex:0 0 auto;

    margin:0;

    min-height:var(--controls--min-height);

    &:focus{
      z-index:1;
    }
  }

  .group__label{
    border-color:var(--border-color-control);
    border-style:solid;

    padding:.125em .5em .25em;
  }

  .group__input{
    flex:1 1 auto;

    :where(&:not([type=radio],[type=checkbox],[type=select])){
      display:block;
      width:100%;
    }
  }

  .group__action{
    padding:var(--btn--padding);

    :where(.group,.group-vertical):has(>.group__label,>.group__input)>&{
      padding:.125em 1em .25em;
    }
  }

  .group__action,.group__input{
    &:focus,&:focus-within{
      box-shadow:revert-layer;
    }
  }

  .group--border-radius{
    &>:first-child{
      border-bottom-left-radius:inherit;
      border-top-left-radius:inherit;
    }

    &>:last-child{
      border-bottom-right-radius:inherit;
      border-top-right-radius:inherit;
    }

    :where(&>.popper-container) .group__action{
      border-radius:inherit;
    }
  }

  :where(.group--border){
    &>:is(.group__label,.group__input,.group__action),>.popper-container>.group__action{
      border-width:1px;
    }

    &:not(.group-vertical)>:not(:last-child){
      border-right-width:0;
    }

    &:is(.group-vertical)>:not(:last-child){
      border-bottom-width:0;
    }
  }
  .form__group{
    border:none;
    margin:auto auto var(--elements-block-level-space, 1rem);
    padding:0;
  }

  .form__label{
    color:var(--font-color-alt-1);

    display:inline-block;
    font-size:1rem;

    margin:0 0 var(--elements-block-level-space, .5rem);
  }

  .form__description{
    color:var(--font-color-alt-2);
    display:block;
    font-size:.8em;

    margin:-.5em auto .25rem;
  }

  .form__control{
    border:0 var(--controls--border-style) var(--controls--border-color);
      border-width:var(--controls--border-width);
    color:var(--font-color);

    margin:auto auto var(--elements-block-level-space, .5rem);
    
    width:100%;

    :where(&) .group__label{
      background:var(--background-color);
      color:var(--font-color-alt-1);
    }

    &>:is(:first-child):is(:last-child){
      margin:0;
      width:100%;
    }
    
    &>:not([type=checkbox],[type=radio]){
      border-width:0;
    }
    
    &:not(.group-vertical)>:not([type=checkbox],[type=radio],:last-child){
      border-right-width:1px;
    }

    &:is(.group-vertical)>:not([type=checkbox],[type=radio],:last-child){
      border-bottom-width:1px;
    }

    :where(&):focus,:where(&):focus-within{
      box-shadow:var(--focus--box-shadow);
    }

    & [type=file]:focus-visible::-webkit-file-upload-button{
      text-decoration:underline 2px dashed var(--color-base-9);
    }

    & :is(input:not([type=checkbox],[type=radio]),textarea):focus,&:is(input:not([type=checkbox],[type=radio]),textarea):focus{
        outline:none;
    }
  }
  .feedback,.invalid-feedback,.valid-feedback{
    display:none;
    font-size:.9em;
    margin-bottom:.25rem;
    :where(.form__group:is([data-is-valid],[data-is-invalid]),.form__group:has([data-is-valid],[data-is-invalid])) &,:where(form[data-was-validated]) &{
      display:block;
    }
  }

  .valid-feedback,:where(.form__group:is([data-is-valid]),.form__group:has([data-is-valid])) .feedback{
    color:var(--color-success-80);
  }

  .invalid-feedback,:where(.form__group:is([data-is-invalid]),.form__group:has([data-is-invalid])) .feedback{
    color:var(--color-caution-80);
  }

  form:not([novalidate]) .form__group:not(:has(.form__control[novalidate])){
    &:has(:user-valid:not(:is(:placeholder-shown))){
      .feedback,.valid-feedback{
        display:block;
      }
    }

    &:has(:user-invalid){
      .feedback,.invalid-feedback{
        display:block;
      }
    }
  }

  .form__group:has([data-is-valid]) .form__control,form:not([novalidate]) .form__control:not([novalidate]):where(:has(:user-valid:not(:is(:placeholder-shown))),:is(:user-valid:not(:is(:placeholder-shown)))),form[data-was-validated] .form__group:has(.valid-feedback) .form__control{
    &:not(.form__control--validation-icon){
      border-color:var(--color-success-60);
    }
    
    &:not(.form__control--validation-border){
      background:var(--input--background) url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='oklch(0.58 0.19 135.24)' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1'/%3E%3C/svg%3E") right .5em center/1.2em no-repeat;
      padding-right:2.25em;
      
      >:last-child{
        border-width:0 1px 0 0;
      }
    }
  }

  .form__group:has([data-is-invalid]) .form__control,form:not([novalidate]) .form__control:not([novalidate]):where(:has(:user-invalid),:is(:user-invalid)),form[data-was-validated] .form__group:has(.invalid-feedback) .form__control{
    &:not(.form__control--validation-icon){
      border-color:var(--color-caution-60);
    }
    
    &:not(.form__control--validation-border){
      background:var(--input--background) url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='oklch(0.58 0.15 108.19)' viewBox='0 0 12 12'%3E%3Ccircle cx='6' cy='6' r='4.5'/%3E%3Cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3E%3Ccircle cx='6' cy='8.2' r='.6' fill='oklch(0.58 0.15 108.19)' stroke='none'/%3E%3C/svg%3E") right .5em center/1.25em no-repeat;
      padding-right:2.25em;
      
      >:last-child{
        border-width:0 1px 0 0;
      }
    }
  }
  .container,.container-lg,.container-md,.container-sm,.container-xl,.container-xs{
    --gutter-x:1.5rem;
    --gutter-y:0;
    container-type:inline-size;
    margin:0 auto;
    padding:0 calc(var(--gutter-x)*.5);
    width:100%;
  }

  .container-lg,.container-xl{
    max-width:1600px;
  }

  .container-md{
    max-width:1200px;
  }

  .container-sm{
    max-width:816px;
  }

  .container-xs{
    max-width:576px;
  }
  .row{
    --gutter-x:1.5rem;
    --gutter-y:0;

    align-items:baseline;
    container-type:inline-size;
    display:flex;
    flex-flow:row wrap;
    margin-bottom:1rem;
    margin-left:calc(var(--gutter-x)*-.5);
    margin-right:calc(var(--gutter-x)*-.5);

    margin-top:calc(var(--gutter-y)*-1);
    
    &>*{
      flex-shrink:0;
      margin-top:var(--gutter-y);
      max-width:100%;
      padding-left:calc(var(--gutter-x)*.5);
      padding-right:calc(var(--gutter-x)*.5);
      width:100%;
    }
  }

  .col{
    flex:1 0 0%;
  }

  .col-auto{
    flex:0 0 auto;
    width:auto;
  }

  .col-1{
    width:8.33333333%;
  }

  .col-1,.col-2{
    flex:0 0 auto;
  }

  .col-2{
    width:16.66666667%;
  }

  .col-3{
    width:25%;
  }

  .col-3,.col-4{
    flex:0 0 auto;
  }

  .col-4{
    width:33.33333333%;
  }

  .col-5{
    width:41.66666667%;
  }

  .col-5,.col-6{
    flex:0 0 auto;
  }

  .col-6{
    width:50%;
  }

  .col-7{
    width:58.33333333%;
  }

  .col-7,.col-8{
    flex:0 0 auto;
  }

  .col-8{
    width:66.66666667%;
  }

  .col-9{
    flex:0 0 auto;
    width:75%;
  }

  .col-10{
    flex:0 0 auto;
    width:83.33333333%;
  }

  .col-11{
    flex:0 0 auto;
    width:91.66666667%;
  }

  .col-12{
    flex:0 0 auto;
    width:100%
  }
  @container (max-width: 1280px){
    .accordions--md-vertical{
      flex-flow:column nowrap;

      >.accordion{
        flex-flow:column nowrap;
        min-width:auto;

        transition:none;

        &:first-child{
          border-radius:unset;
          border-bottom-left-radius:inherit;
          border-top-left-radius:inherit;
          border-width:var(--accordion-first-child--border-width, 1px 1px 0 1px);
        }

        &:last-child{
          border-radius:unset;
          border-bottom-right-radius:inherit;
          border-top-right-radius:inherit;
          border-width:var(--accordion-last-child--border-width, 0 1px 1px 1px);
        }

        &:not(:first-child,:last-child){
          border-width:var(--accordion--border-width, 1px 1px 1px 1px);
        }
      }

      .accordion__header{
        border-width:0 0 1px;
        margin:0 0 -1px;

        padding:.5rem 1em;

        writing-mode:initial;

        .visual-indicator{
          transform:rotate(90deg);
        }

        &:has([data-accordion-select-handler]:checked) .visual-indicator{
          transform:rotate(90deg) scaleX(-1);
        }
      }

      .accordion__body{
        display:grid;
        grid:0fr / auto;

        transition:grid .35s ease-in-out,visibility .35s ease-in-out;
        visibility:hidden;

        .accordion:has(>.accordion__header>[data-accordion-select-handler]:checked)>&{
          grid:1fr / auto;
          visibility:visible;
        }
      }

      &.accordions--vertical-height-auto{
        height:auto !important;

        .accordion__content{
          position:static;
        }
      }
    }
    .col-md{
      flex:1 0 0%;
    }

    .col-md-auto{
      flex:0 0 auto;
      width:auto;
    }

    .col-md-1{
      flex:0 0 auto;
      width:8.33333333%;
    }

    .col-md-2{
      flex:0 0 auto;
      width:16.66666667%;
    }

    .col-md-3{
      flex:0 0 auto;
      width:25%;
    }

    .col-md-4{
      flex:0 0 auto;
      width:33.33333333%;
    }

    .col-md-5{
      flex:0 0 auto;
      width:41.66666667%;
    }

    .col-md-6{
      flex:0 0 auto;
      width:50%;
    }

    .col-md-7{
      flex:0 0 auto;
      width:58.33333333%;
    }

    .col-md-8{
      flex:0 0 auto;
      width:66.66666667%;
    }

    .col-md-9{
      flex:0 0 auto;
      width:75%;
    }

    .col-md-10{
      flex:0 0 auto;
      width:83.33333333%;
    }

    .col-md-11{
      flex:0 0 auto;
      width:91.66666667%;
    }

    .col-md-12{
      flex:0 0 auto;
      width:100%
    }
  }

  @container (max-width: 768px){
    .accordions--sm-vertical{
      flex-flow:column nowrap;

      >.accordion{
        flex-flow:column nowrap;
        min-width:auto;

        transition:none;

        &:first-child{
          border-radius:unset;
          border-bottom-left-radius:inherit;
          border-top-left-radius:inherit;
          border-width:var(--accordion-first-child--border-width, 1px 1px 0 1px);
        }

        &:last-child{
          border-radius:unset;
          border-bottom-right-radius:inherit;
          border-top-right-radius:inherit;
          border-width:var(--accordion-last-child--border-width, 0 1px 1px 1px);
        }

        &:not(:first-child,:last-child){
          border-width:var(--accordion--border-width, 1px 1px 1px 1px);
        }
      }

      .accordion__header{
        border-width:0 0 1px;
        margin:0 0 -1px;

        padding:.5rem 1em;

        writing-mode:initial;

        .visual-indicator{
          transform:rotate(90deg);
        }

        &:has([data-accordion-select-handler]:checked) .visual-indicator{
          transform:rotate(90deg) scaleX(-1);
        }
      }

      .accordion__body{
        display:grid;
        grid:0fr / auto;

        transition:grid .35s ease-in-out,visibility .35s ease-in-out;
        visibility:hidden;

        .accordion:has(>.accordion__header>[data-accordion-select-handler]:checked)>&{
          grid:1fr / auto;
          visibility:visible;
        }
      }

      &.accordions--vertical-height-auto{
        height:auto !important;

        .accordion__content{
          position:static;
        }
      }
    }
    .col-sm{
      flex:1 0 0%;
    }

    .col-sm-auto{
      flex:0 0 auto;
      width:auto;
    }

    .col-sm-1{
      flex:0 0 auto;
      width:8.33333333%;
    }

    .col-sm-2{
      flex:0 0 auto;
      width:16.66666667%;
    }

    .col-sm-3{
      flex:0 0 auto;
      width:25%;
    }

    .col-sm-4{
      flex:0 0 auto;
      width:33.33333333%;
    }

    .col-sm-5{
      flex:0 0 auto;
      width:41.66666667%;
    }

    .col-sm-6{
      flex:0 0 auto;
      width:50%;
    }

    .col-sm-7{
      flex:0 0 auto;
      width:58.33333333%;
    }

    .col-sm-8{
      flex:0 0 auto;
      width:66.66666667%;
    }

    .col-sm-9{
      flex:0 0 auto;
      width:75%;
    }

    .col-sm-10{
      flex:0 0 auto;
      width:83.33333333%;
    }

    .col-sm-11{
      flex:0 0 auto;
      width:91.66666667%;
    }

    .col-sm-12{
      flex:0 0 auto;
      width:100%
    }
  }

  @container (max-width: 640px){
    .accordions--xs-vertical{
      flex-flow:column nowrap;

      >.accordion{
        flex-flow:column nowrap;
        min-width:auto;

        transition:none;

        &:first-child{
          border-radius:unset;
          border-bottom-left-radius:inherit;
          border-top-left-radius:inherit;
          border-width:var(--accordion-first-child--border-width, 1px 1px 0 1px);
        }

        &:last-child{
          border-radius:unset;
          border-bottom-right-radius:inherit;
          border-top-right-radius:inherit;
          border-width:var(--accordion-last-child--border-width, 0 1px 1px 1px);
        }

        &:not(:first-child,:last-child){
          border-width:var(--accordion--border-width, 1px 1px 1px 1px);
        }
      }

      .accordion__header{
        border-width:0 0 1px;
        margin:0 0 -1px;

        padding:.5rem 1em;

        writing-mode:initial;

        .visual-indicator{
          transform:rotate(90deg);
        }

        &:has([data-accordion-select-handler]:checked) .visual-indicator{
          transform:rotate(90deg) scaleX(-1);
        }
      }

      .accordion__body{
        display:grid;
        grid:0fr / auto;

        transition:grid .35s ease-in-out,visibility .35s ease-in-out;
        visibility:hidden;

        .accordion:has(>.accordion__header>[data-accordion-select-handler]:checked)>&{
          grid:1fr / auto;
          visibility:visible;
        }
      }

      &.accordions--vertical-height-auto{
        height:auto !important;

        .accordion__content{
          position:static;
        }
      }
    }
    .col-xs{
      flex:1 0 0%;
    }

    .col-xs-auto{
      flex:0 0 auto;
      width:auto;
    }

    .col-xs-1{
      flex:0 0 auto;
      width:8.33333333%;
    }

    .col-xs-2{
      flex:0 0 auto;
      width:16.66666667%;
    }

    .col-xs-3{
      flex:0 0 auto;
      width:25%;
    }

    .col-xs-4{
      flex:0 0 auto;
      width:33.33333333%;
    }

    .col-xs-5{
      flex:0 0 auto;
      width:41.66666667%;
    }

    .col-xs-6{
      flex:0 0 auto;
      width:50%;
    }

    .col-xs-7{
      flex:0 0 auto;
      width:58.33333333%;
    }

    .col-xs-8{
      flex:0 0 auto;
      width:66.66666667%;
    }

    .col-xs-9{
      flex:0 0 auto;
      width:75%;
    }

    .col-xs-10{
      flex:0 0 auto;
      width:83.33333333%;
    }

    .col-xs-11{
      flex:0 0 auto;
      width:91.66666667%;
    }

    .col-xs-12{
      flex:0 0 auto;
      width:100%
    }
  }

  @container (max-width: 430px){}

  @container (max-width: 200px){}
  @media screen and (max-width:1280px){
    .navbar--vmd-compact{
      justify-content:space-between;

      :where(.navbar__toggle){

        opacity:1;
        overflow:initial;
        position:static;
        visibility:visible;
      }

      >.nav{
        display:none;
        overflow:hidden;

        transition:display allow-discrete .2s,margin-top .2s ease-in-out;

        >.nav__item>.nav{
          filter:none;
        }

        >.nav__item:first-child{
          margin-top:-110%;

          transition:margin-top .35s ease-in-out;
        }
      }

      .nav{
        background:transparent;

        position:static;
        width:100%;

        .nav{
          display:none;
          margin:.5rem -1rem -.5rem;
          padding:0 0 0 1rem;

          transition:none;
          width:calc(100% + 2rem);
        }
      }

      .nav__item{
        .nav__item:first-child{
          margin:0;
        }

        .nav__item:last-child{
          padding:.5rem 1rem;
        }
        
        &:hover{
          filter:brightness(96%);
        }
      }

      &:not(.navbar--no-hover) .nav__item:hover,.nav__item:is(:focus,:focus-within){
        >.nav{
          display:block;
        }
      }

      &:has([data-toggle-navbar-handler]:checked),:where(&)[data-navbar-active=true i]{
        >.nav{
          display:block;

          >.nav__item:first-child{
            margin-top:0;
          
            @starting-style{
              margin-top:-110%;
            }
          }
        }
      }
    }
    .appear--vmd-offcanvas{
      backdrop-filter:blur(1px);

      background:var(--backdrop--background);

      display:initial;
      inset:0;

      max-height:none;
      max-width:none;
      position:fixed;

      transition:visibility .35s ease-in-out;

      z-index:var(--z-index-offcanvas);

      .appear__content{
        background:var(--appear--offcanvas_-appear__content--background);

        box-shadow:var(--shadow-float);
        height:auto;
        max-height:40vh;

        min-height:50px;
        position:absolute;

        transition:translate .35s ease-in-out;

        translate:0 -10%;

        width:100%;
      }

      &:has(>[data-appear-handler]:checked),&:where([data-appear-active=true i]){
        visibility:visible;

        .appear__content{
          translate:0;
        }
      }

      &:is(.appear--right) .appear__content{
        height:100%;
        inset:0 0 0 auto;
        max-height:100%;
        max-width:40vw;
        min-width:275px;
        translate:100%;
        width:auto;
      }

      &:is(.appear--bottom) .appear__content{
        inset:auto 0 0 0;
        translate:0 100%;
      }

      &:is(.appear--left) .appear__content{
        height:100%;
        inset:0 auto 0 0;
        max-height:100%;
        max-width:40vw;
        min-width:275px;
        translate:-10%;
        width:auto;
      }

      &:is(.appear--fix){
        .appear__content{
          height:var(--appear-size);
          max-height:none;
          max-width:none;
          min-height:auto;
          min-width:auto;
        }

        &:is(.appear--right) .appear__content{
          height:100%;
          width:var(--appear-size);
        }

        &:is(.appear--bottom) .appear__content{
          height:var(--appear-size);
        }

        &:is(.appear--left) .appear__content{
          height:100%;
          width:var(--appear-size);
        }
      }
    }
  }
  @media screen and (max-width:768px){
    .navbar--vsm-compact{
      justify-content:space-between;

      :where(.navbar__toggle){

        opacity:1;
        overflow:initial;
        position:static;
        visibility:visible;
      }

      >.nav{
        display:none;
        overflow:hidden;

        transition:display allow-discrete .2s,margin-top .2s ease-in-out;

        >.nav__item>.nav{
          filter:none;
        }

        >.nav__item:first-child{
          margin-top:-110%;

          transition:margin-top .35s ease-in-out;
        }
      }

      .nav{
        background:transparent;

        position:static;
        width:100%;

        .nav{
          display:none;
          margin:.5rem -1rem -.5rem;
          padding:0 0 0 1rem;

          transition:none;
          width:calc(100% + 2rem);
        }
      }

      .nav__item{
        .nav__item:first-child{
          margin:0;
        }

        .nav__item:last-child{
          padding:.5rem 1rem;
        }
        
        &:hover{
          filter:brightness(98%);
        }
      }

      &:not(.navbar--no-hover) .nav__item:hover,.nav__item:is(:focus,:focus-within){
        >.nav{
          display:block;
        }
      }

      &:has([data-toggle-navbar-handler]:checked),:where(&)[data-navbar-active=true i]{
        >.nav{
          display:block;

          >.nav__item:first-child{
            margin-top:0;
          
            @starting-style{
              margin-top:-110%;
            }
          }
        }
      }
    }
    .appear--vsm-offcanvas{
      backdrop-filter:blur(1px);

      background:var(--backdrop--background);

      display:initial;
      inset:0;

      max-height:none;
      max-width:none;
      position:fixed;

      transition:visibility .35s ease-in-out;

      z-index:var(--z-index-offcanvas);

      .appear__content{
        background:var(--appear--offcanvas_-appear__content--background);

        box-shadow:var(--shadow-float);
        height:auto;
        max-height:40vh;

        min-height:50px;
        position:absolute;

        transition:translate .35s ease-in-out;

        translate:0 -10%;

        width:100%;
      }

      &:has(>[data-appear-handler]:checked),&:where([data-appear-active=true i]){
        visibility:visible;

        .appear__content{
          translate:0;
        }
      }

      &:is(.appear--right) .appear__content{
        height:100%;
        inset:0 0 0 auto;
        max-height:100%;
        max-width:40vw;
        min-width:275px;
        translate:100%;
        width:auto;
      }

      &:is(.appear--bottom) .appear__content{
        inset:auto 0 0 0;
        translate:0 100%;
      }

      &:is(.appear--left) .appear__content{
        height:100%;
        inset:0 auto 0 0;
        max-height:100%;
        max-width:40vw;
        min-width:275px;
        translate:-10%;
        width:auto;
      }

      &:is(.appear--fix){
        .appear__content{
          height:var(--appear-size);
          max-height:none;
          max-width:none;
          min-height:auto;
          min-width:auto;
        }

        &:is(.appear--right) .appear__content{
          height:100%;
          width:var(--appear-size);
        }

        &:is(.appear--bottom) .appear__content{
          height:var(--appear-size);
        }

        &:is(.appear--left) .appear__content{
          height:100%;
          width:var(--appear-size);
        }
      }
    }
  }
  @media screen and (max-width:640px){}
}

@layer ui{
  [be-icon]{

    display:inline-block;
    height:var(--indicator-dimension, 1em);

    line-height:1;
    position:relative;
    
    translate:0 .125em;
    width:var(--indicator-dimension, 1em);

    &:after,&:before{
      display:block;

      inset:50% auto auto 50%;
      position:absolute;
      transform:translate(-50%, -50%);
    }
  }
  [be-icon=burger-menu]{
    &:after{

      background:currentColor;
      box-shadow:0 -.2em,0 .2em;
      content:"";
      height:.125em;
      width:.75em;
    }
  }
  [be-icon=caret]{
    &:after{
      border-bottom:.25em solid;
      border-left:.25em solid transparent;

      border-right:.25em solid transparent;
      content:"";
    }
  }
  [be-icon=chevron]{
    &:after{
      border:0 solid;
      border-width:.125em 0 0 .125em;
      content:"";
      height:.5em;

      transform:translate(-25%, -50%) rotate(-45deg);
      width:.5em;
    }
  }
  [be-icon=circle]{
    &:after{

      background:currentColor;
      border-radius:50%;
      content:"";

      height:.75em;
      width:.75em;
    }
  }
  [be-icon="!"]{
    &:after{
      content:"!";

      font-family:monospace;
      font-style:normal;
      font-weight:700;
    }
  }
  [be-icon=external-link]{
    &:before{

      border-bottom:.125em solid;
      content:"";
      inset:.575em 0 auto auto;
      transform:rotate(-45deg);

      width:1em;
    }

    &:after{

      border-right:.125em solid;
      border-top:.125em solid;
      content:"";

      height:.5em;
      inset:.5em -.125em auto auto;
      width:.5em;
    }
  }
  [be-icon=i]{
    &:after{
      content:"i";

      font-family:serif;
      font-size:.9em;
      font-style:italic;
      font-weight:700;

      inset:50% auto auto 50%;
      transform:translate(-50%, -50%);
    }
  }
  [be-icon=left-check]{
    &:after{
      border-style:solid;

      border-width:0 .125em .125em 0;
      content:"";

      height:.75em;
      inset:.5em auto auto .2em;

      rotate:45deg;
      width:.325em;
    }
  }
  @keyframes rotate{
    0%{
      transform:rotate(0deg);
    }
    to{
      transform:rotate(1turn);
    }
  }

  [be-icon=loading]{
    :has(>&){
      cursor:progress;
    }

    &:after{

      animation:rotate .5s linear infinite;

      border-bottom:.125em solid;

      border-left:.125em solid;
      border-radius:50%;
      border-right:0;
      border-right-color:transparent;
      border-top:.125em solid transparent;
      content:"";

      height:.75em;

      inset:.125em auto auto .125em;
      width:.75em;
    }
  }
  [be-icon=rectangle]{
    &:after{

      background:currentColor;
      border-radius:.125em;
      content:"";

      height:.75em;
      width:.75em;
    }
  }
  [be-icon=stop]{
    &:after,&:before{
      content:"";
    }

    &:before{
      border:.125em solid;
      border-radius:50%;

      height:.825em;
      width:.825em;
    }

    &:after{
      border:solid;
      border-radius:.125em;
      border-width:0 0 .125em;

      height:.125em;

      inset:.75em auto auto .325em;

      rotate:45deg;
      width:.75em;
    }
  }
  [be-icon=triangle]{
    &:after{

      background:currentColor;

      clip-path:polygon(50% 0, 100% 100%, 0 100%);
      content:"";
      height:.75em;
      inset:50% auto auto 50%;
      inset:45% auto auto 50%;
      width:.825em;
    }
  }
  [be-icon=x]{
    translate:unset;
    
    &:after,&:before{
      border:solid;
      border-radius:1em;
      border-width:0 0 .125em;
      content:"";

      height:0;
      inset:.25em auto auto .45em;
      inset:.25em auto auto 25%;
      rotate:-45deg;
      translate:25%;
      width:.75em;
    }

    &:before{
    }

    &:after{
      transform:translate(-50%, -50%) rotate(90deg) scaleX(-1);
    }
  }
  .visual-aside{
    font-size:var(--visual-aside--font-size, 1em);
  }

  .visual-aside,.visual-indicator{
    display:inline-block;

    height:var(--indicator-dimension, 1em);

    position:relative;
    width:var(--indicator-dimension, 1em);
  }

  .visual-indicator{
    font-size:var(--visual-indicator--font-size, 1em);
  }
  .stack{
    display:inline-grid;
    height:2em;
    place-items:center;
    width:2.5em;
    
    >*{
      grid-area:1 / 1;
    }
    
    >:where([be-icon].stack-1x){
      translate:0 .25em;
    }
  }

  .stack-2x{
    font-size:2em;
  }

  .stack-1x{
    line-height:inherit;
  }
  .placeholder{
    background:var(--bg-color-off);
    display:inline-block;
    height:1em;
    vertical-align:middle;
    width:100%;
  }
  :is(button,[type=button],[type=reset],[type=submit],.btn):where(:active,:focus,:focus-visible,:focus-within,:hover){
    &[be-animation]{
      animation:none;
    }
  }
  @keyframes pulse-animation{
    0%{
      box-shadow:0 0 0 0 rgba(0,0,0,.2);
    }
    to{
      box-shadow:0 0 0 20px transparent;
    }
  }

  [be-animation=pulse]{
    animation:pulse-animation 2s infinite;
  }
  [be-animation=rotate]{
    animation:rotate .5s linear infinite;
  }
  @keyframes tilt-shake{
    55%{ transform:translate(0) rotate(0deg); }
    56%{ transform:translate(6px, 5px) rotate(5deg); }
    57%{ transform:translate(-6px, 5px) rotate(-5deg); }
    58%{ transform:translate(2px, -3px) rotate(2deg); }
    59%{ transform:translate(-2px, -3px) rotate(-2deg); }
    60%{ transform:translate(0) rotate(0deg); }
  }

  [be-animation=tilt-shake]{
    animation:tilt-shake 5s infinite;
  }
  .invisible{
    height:0;

    opacity:0;
    overflow:auto;
    overflow:clip;
    position:absolute;
    width:0;
  }

  .visible{
    height:auto;

    opacity:1;
    overflow:initial;
    position:static;
    width:auto;
  }
  @media screen and (max-width:1280px){
    .invisible-vmd{
        height:0;

        opacity:0;
        overflow:auto;
        overflow:clip;
        position:absolute;
        width:0;
    }

    .visible-vmd{
        height:auto;

        opacity:1;
        overflow:initial;
        position:static;
        width:auto;
    }
  }

  @media screen and (max-width:768px){
    .invisible-vsm{
        height:0;

        opacity:0;
        overflow:auto;
        overflow:clip;
        position:absolute;
        width:0;
    }

    .visible-vsm{
        height:auto;

        opacity:1;
        overflow:initial;
        position:static;
        width:auto;
    }
  }
}

@layer ui{
  .bg-none{
    background:none;
  }

  .bg-transparent{
    background:transparent;
  }
  .bg-white{background-color:#fff}

  .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); }
  .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:0 var(--controls--border-style) var(--controls--border-color, var(--border-color-control));
    border-width:var(--controls--border-width);
  }
  .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-\.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;
  }
  .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%;
  }
  .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:.5rem;
  }

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

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

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

  .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;
  }
.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;}
  .txt-white{color:#fff; }
  
  .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); }
  .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;
  }
  .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:.25;
  }

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

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

  .opacity-1{
    opacity:1;
  }
  .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;
  }
  .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;
  }
  .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-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;
    gap:.5rem;
    grid-auto-flow:column;
    grid-template-rows:repeat(auto-fit, minmax(1rem, max-content));
  }

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

  .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;
  }
  .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{
    bottom:0;
    content:"";
    left:0;

    position:absolute;
    right:0;
    top:0;

    z-index:1;
  }
  .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-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;
  }
  .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:-.5rem;
  }
  .margin-right-min-\.50{
    margin-right:-.5rem;
  }
  .margin-bottom-min-\.50{
    margin-bottom:-.5rem;
  }
  .margin-left-min-\.50{
    margin-left:-.5rem;
  }

  .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.5rem;
  }
  .margin-right-min-1\.50{
    margin-right:-1.5rem;
  }
  .margin-bottom-min-1\.50{
    margin-bottom:-1.5rem;
  }
  .margin-left-min-1\.50{
    margin-left:-1.5rem;
  }

  .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.5rem;
  }
  .margin-right-min-2\.50{
    margin-right:-2.5rem;
  }
  .margin-bottom-min-2\.50{
    margin-bottom:-2.5rem;
  }
  .margin-left-min-2\.50{
    margin-left:-2.5rem;
  }

  .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:.5rem;
  }
  .margin-right-\.50{
    margin-right:.5rem;
  }
  .margin-bottom-\.50{
    margin-bottom:.5rem;
  }
  .margin-left-\.50{
    margin-left:.5rem;
  }

  .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.5rem;
  }
  .margin-right-1\.50{
    margin-right:1.5rem;
  }
  .margin-bottom-1\.50{
    margin-bottom:1.5rem;
  }
  .margin-left-1\.50{
    margin-left:1.5rem;
  }

  .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.5rem;
  }
  .margin-right-2\.50{
    margin-right:2.5rem;
  }
  .margin-bottom-2\.50{
    margin-bottom:2.5rem;
  }
  .margin-left-2\.50{
    margin-left:2.5rem;
  }

  .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:-.5rem;
  }
  .padding-right-min-\.50{
    padding-right:-.5rem;
  }
  .padding-bottom-min-\.50{
    padding-bottom:-.5rem;
  }
  .padding-left-min-\.50{
    padding-left:-.5rem;
  }

  .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.5rem;
  }
  .padding-right-min-1\.50{
    padding-right:-1.5rem;
  }
  .padding-bottom-min-1\.50{
    padding-bottom:-1.5rem;
  }
  .padding-left-min-1\.50{
    padding-left:-1.5rem;
  }

  .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.5rem;
  }
  .padding-right-min-2\.50{
    padding-right:-2.5rem;
  }
  .padding-bottom-min-2\.50{
    padding-bottom:-2.5rem;
  }
  .padding-left-min-2\.50{
    padding-left:-2.5rem;
  }

  .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:.5rem;
  }
  .padding-right-\.50{
    padding-right:.5rem;
  }
  .padding-bottom-\.50{
    padding-bottom:.5rem;
  }
  .padding-left-\.50{
    padding-left:.5rem;
  }

  .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.5rem;
  }
  .padding-right-1\.50{
    padding-right:1.5rem;
  }
  .padding-bottom-1\.50{
    padding-bottom:1.5rem;
  }
  .padding-left-1\.50{
    padding-left:1.5rem;
  }

  .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.5rem;
  }
  .padding-right-2\.50{
    padding-right:2.5rem;
  }
  .padding-bottom-2\.50{
    padding-bottom:2.5rem;
  }
  .padding-left-2\.50{
    padding-left:2.5rem;
  }

  .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-end:auto;
    grid-row-start:span 2;
  }

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

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

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

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

  .grid-column-span-4{
    grid-column-end:auto;
    grid-column-start:span 4;
  }
  .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);
  }
  .header-1,.header-2,.header-3,.header-4,.header-5,.header-6,.header-7,.header-8{
    color:var(--h--color, var(--font-color-alt-1));
    font:var(--h--font-weight) 4rem / var(--h--line-height) var(--h--font-family);
    
    letter-spacing:var(--h--letter-spacing);
  }
  
  :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 + .125vw), 4.5rem);
  }

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

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

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

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

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

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

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

  .subheader{
    font-size:max(50%, .5em);
    font-size:.61805em;
  }

  .subtext{
    font-size:.8rem;
  }
  .initial-letter-2:first-letter{
    initial-letter:2;
  }
  
  .initial-letter-3:first-letter{
    initial-letter:3;
  }
  .font-size-\.1{
    font-size:.1rem;
  }

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

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

  .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:400;
  }

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

  .font-style-italic{
    font-style:italic;
  }
  .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-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-balance{
    text-wrap:balance;
  }
  .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;
  }
  .overscroll-behavior-contain{
    overscroll-behavior:contain;
  }
  
  
  .lazy-render>:nth-child(){
    contain-intrinsic-size:auto 500px;
    content-visibility:auto;
  }
  @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 and (max-width:1280px){
  }

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

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