@charset "UTF-8";
: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;
    --font:var(--font-style) var(--font-variant) var(--font-weight) var(--font-stretch) var(--font-size) / var(--line-height) var(--font-family);
    --letter-spacing:0.06em;
    
    --accent-color:oklch(0.59 0.11 281.84);
    
    --font-color:oklch(0.36 0.02 285.26);
    --font-color:oklch(0 0 0);
    --font-color-alt-1:oklch(0.44 0.02 284.16);
    --font-color-alt-2:oklch(0.6 0.02 285.26);
    
    --bg-color:oklch(0.98 0 0);
    --bg-color-text-alt-1:oklch(0.36 0.02 285.26);
    --bg-color-text:oklch(0.95 0.01 285.37);
    --bg-color-clickable:oklch(0.96 0.01 285.53);
    --border-color-control:oklch(0.75 0.02 285.18);
    --border-color-boundary:oklch(0.82 0.02 285.18);
    --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);
    
    --elements-block-level-space:1rem;
    
    --boundary--border:1px solid var(--border-color-boundary);
    
    --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);
    
    --backdrop--bg-color:var(--transparent-color);
    
    --dialog--height:auto;
    --dialog--width:auto;

    --blockquote--border-width:0 0 0 4px;
    --blockquote--border-style:solid;
    --blockquote--border-color:var(--border-color-boundary);
    --blockquote_--footer--color:var(--font-color-alt-2);
    --blockquote_--footer--margin:1rem 0 0;
    
    --pre--color:var(--font-color-alt-1);
    --pre--background:var(--bg-color-text);
    --pre--border:var(--boundary--border);
    --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(--pre--background) .9 c h / .8);

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

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

    --input--bg-color:white;
    
    --btn--font-weight:400;
    --btn--font-size:var(--font-size);
    --btn--line-height:1.5;
    --btn--font:normal var(--btn--font-weight) var(--btn--font-size) / var(--btn--line-height) var(--font-family);
    --btn--font-color:var(--font-color);
    --btn--bg-color:var(--bg-color-clickable);
    --btn--paddings:0.2lh 1.5em;
    --btn--paddings:.2lh .75lh .25lh;
    --btn--borders-width:1px;
    --btn--border-style:solid;
    --btn--border-color:var(--border-color-control);
    --btn--borders-radius:0.375em;
    --btn--borders-radius:0.25em;
    --btn--shadow:var(--shadow-clickable);

    --moz-input--paddings:0.125em 0.25em 0.25em;
    --moz-input--select-paddings:0.125em 0.25em 0.25em;
    --moz-btn-paddings:0.2lh 1.5em;
    --moz-btn-paddings:.2lh .75lh .25lh;
}
:root{
  --color-base-white:white;
  --color-base-1:oklch(0.99 0 0);
  --color-base-2:;
  --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);
  --bg-color-off:oklch(0.9 0.02 285.26);
  --bg-color-active:oklch(0.97 0.01 285.51);
  --border-color-light:oklch(0.9 0.02 285.18);
  --shadow-float-alt-1:drop-shadow(0 2px 2px var(--transparent-color));
  --shadow-border:drop-shadow(0 1px 1px var(--transparent-color));
  
  --as-btn--paddings:.21lh 1em .26lh;
  --as-btn--paddings:.2lh .75lh .25lh;
  --indicator-dimension:1em;
   --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;
  --avatar-size:1;
  --badge-size:1;
  --btn-size:1;
  --toggle-size:1;
  --popover-space:1;
  --visual-aside-size:1;
  --visual-indicator-size:1;
}
@layer base{
    *,
    *::before,
    *::after{
        box-sizing:border-box;
        margin:0;
        padding:0;
    }

    *:focus-visible{
        outline:var(--focus-outline);
    }

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

    html{
        font:var(--font);
        -webkit-text-size-adjust:100%;
        &:has(dialog[open], dialog[popover]:popover-open){
            overflow:hidden;
        }
    }

    body{
        accent-color:var(--accent-color);
        color:var(--font-color);
        background:var(--bg-color);
        letter-spacing:var(--letter-spacing);
        line-height:var(--line-height);
    }

    main{
        display:block;
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6{
        font:var(--h--font-weight) 4rem / var(--h--line-height) var(--h--font-family);
        
        letter-spacing:var(--h--letter-spacing);
        color:var(--h--color);
        
        margin:2.5rem 0 1.25rem;
    }

    h1{
        font-size:clamp(2.799rem, calc(2.799rem + 0.125vw), 3.799rem);
    }

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

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

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

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

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

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

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

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

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

    fieldset{
        border:var(--boundary--border);
        padding:0.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{
        font-weight:bold;
    }

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

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

        color:inherit;
        overflow:visible;
        margin:0.5rem 0;
    }

    a{
        display:inline-block;

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

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

    [href]{
        color:var(--href--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:bold;
    }

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

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

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

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

    small{
        font-size:80%;
    }

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

    sub{
        bottom:-0.25em;
    }

    sup{
        top:-0.5em;
    }

    img{
        border:none;
        
        max-height:90vh;
        max-width:90vw;
        
        display:inline-block;
    }
    
    figure{
        :where(&) img{
            margin:auto auto 0.5rem;
            line-height:1;
        }
    }
    
    figcaption{
        font-size:0.875em;
    }
    
    button,
    input,
    optgroup,
    option,
    select,
    textarea{
        color:var(--controls--font-color);
        font:var(--font-weight) var(--font-size)/var(--line-height) var(--font-family);
    }
    
    button,
    input,
    optgroup,
    select,
    textarea{
        border:var(--controls--border);
        margin:0;
        min-height:var(--controls--min-height);
        padding:var(--controls--padding);
    }
    
    button,
    input,
    select{
        text-transform:none;
    }

    button,
    [type="button"],
    [type="reset"],
    [type="submit"],
    .btn{
        cursor:pointer;

        font:var(--btn--font);
        line-height:var(--btn--line-height);
        color:var(--btn--font-color,);

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

        border:0 var(--btn--border-style) var(--btn--border-color, initial);
        border-width:var(--btn--borders-width, 1px);
        border-radius:var(--btn--borders-radius);

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

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

        position:relative;

        padding:var(--btn--paddings);
        text-align:center;
        text-decoration:none;
        vertical-align:middle;

        overflow:visible;

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

        -webkit-user-select:none;
        -moz-user-select:none;
        user-select:none;

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

        &:disabled{
            color:revert;
        }

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

    input{
        overflow:visible;
    }

    [type="color"]{
        cursor:pointer;
        background:inherit;
        padding:0.25em;
        min-height:2rem;
    }

    [type="checkbox"],
    [type="radio"]{
        min-height:initial;
        padding:0;
    }

    [type="date"],
    [type="datetime-local"],
    [type="month"],
    [type="week"],
    [type="time"]{
        padding:0.125em 0.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 0.125em 0 0;
    }

    ::file-selector-button{
        -webkit-appearance:button;
        font:inherit;
        padding:0.125em 0.25em;
        margin:-1px 0.125em -1px -1px;
    }

    progress{
        display:inline-block;
        vertical-align:baseline;
    }

    select{
        min-width:1.7em;
    }

    select optgroup{
        border:none;
    }

    optgroup{
        color:var(--font-color-alt-1);
        padding:0.125em;
    }

    option{
        margin:0 0 0 .5em;
        padding:0.25em 0.25em 0.125em;
    }

    textarea{
        overflow:auto;
        vertical-align:top;
    }

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

    table{
        text-indent:0;
        border-color:inherit;
    }
    
    th{
        color:var(--font-color-alt-1);
    }

    td{
        padding:0.5em;
    }
    dialog,
    [popover]{
        pointer-events:none;
        
        color:inherit;
        background:var(--bg-color);
        border:none;
        opacity:0;
        
        box-shadow:var(--shadow-float);
        
        position:fixed;
        inset:50% auto auto 50%;

        display:none;
        padding:1rem;

        text-align:initial;
        
        overflow:visible;

        z-index:1000;
        
        transform:translate(-50%, -50%) scale(0.85);
        transition:opacity 350ms ease-in-out, transform 350ms ease-in-out, overlay 350ms allow-discrete, display 350ms allow-discrete;
    }

    dialog{
        min-height:5rem;
        height:var(--dialog--height, auto);
        max-height:calc(100vh - 4rem);
        
        min-width:clamp(280px, 100vw - 4rem, 400px);
        width:var(--dialog--width, auto);
        max-width:clamp(280px, 100vw - 4rem, 1160px);
    }

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

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

    dialog::backdrop,
    [popover]::backdrop{
        background:var(--backdrop--bg-color);
        backdrop-filter:blur(0.5rem);
    }

    template{
        display:none;
    }

    input,
    textarea,
    select,
    [type="color"]{
        background:var(--input--bg-color);
    }

    [type="checkbox"],
    [type="file"],
    [type="radio"],
    [type="range"]{
        cursor:pointer;
    }

    [type="range"]:focus-visible::-webkit-slider-thumb{
        border-radius:50%;
        outline:var(--focus-outline);

        height:0.8em;
        width:0.8em;
    }

    [type="radio"]:focus-visible{
        box-shadow:var(--focus--box-shadow);
    }

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

    [hidden]{
        display:none;
    }

    :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);
    }
    input,
    select,
    textarea,
    audio,
    video,
    details,
    button,
    [type="button"],
    [type="reset"],
    [type="submit"],
    .btn{
        margin:0.25rem;
    }

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

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

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

            &: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{
                cursor:pointer;
                background:var(--accent-color);
                border-radius:.25rem;
                height:.5rem;
            }
        }
    }
}
@layer base{
  
}
@layer ui{
  .avatar{
    font:300 calc(var(--avatar--font-size, .75rem) * var(--avatar-size)) var(--font-family);
    background:var(--color-base-6);

    border-radius:.125em;

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

    position:relative;

    display:inline-block;

    text-align:center;
  }

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

    width:80%;

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

    overflow:hidden;
  }
  
  .avatar__img{
    border-radius:inherit;

    height:100%;
    width:100%;

    position:absolute;
    inset:0 auto auto 0;

    z-index:1;
  }

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

    position:absolute;
    inset:50% auto auto 50%;

    display:block;

    translate:-50% -50%;

    z-index:1;
  }

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

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

    height:var(--avatar__indicator--height, .65em);
    width:var(--avatar__indicator--width, .65em);

    position:absolute;
    inset:0 -.25em auto auto;

    text-align:center;

    z-index:1;
  }

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

    .avatar__indicator{
      inset:0 0 auto auto;

      translate:0;
    }
  }
  .badge{
      user-select:none;
      
    font:normal normal calc(var(--badge--font-size, .9rem) * var(--badge-size)) / 1 var(--font-family);

    color:var(--badge--color, var(--color-base-50));
    background:var(--badge--bg-color, var(--color-base-6));

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

    white-space:nowrap;
    
    min-height:var(--badge--min-height, .75rem);
    min-width:var(--badge--min-width, .75rem);

    display:inline-block;
    margin:0;
    padding:.125rem .5rem .25rem;
    
    display:inline-flex;
    align-items:baseline;
    
    a&{
      text-decoration:none;
    }
  }

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

  .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{
    color:var(--color-danger-70);
    background:var(--color-danger-10);
    border-color:var(--color-danger-20);
  }
  .badge--chip{
    background:var(--bg-color);
    
    border:1px solid currentColor;
    border-radius:.25rem;

    transition:color 200ms ease-out, background 200ms ease-out, border 200ms 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{
    --btn--font-size:calc(var(--btn--font-size, 1rem) * var(--btn-size));

    transition:color 500ms ease-out, background 500ms ease-out, border 500ms ease-out;
  }

  .btn:not(:where(button, [type="button"], [type="reset"], [type="submit"])){
    padding:var(--as-btn--paddings, .21lh 1em .26lh);
  }

  .btn--icon{
    background:none;
    border:none;
    border-radius:50%;
    line-height:1;
    min-height:auto;

    margin:0;
    padding:0;

    box-shadow:none;

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

    &:hover{
      box-shadow:none;
    }
    
    .badge &{
      translate:0 .125em;
    }
  }

  .btn--accent, .btn--low, .btn--normal, .btn--important, .btn--critical, .btn--success, .btn--info, .btn--caution, .btn--warning, .btn--error, .btn--danger{
    &:not(:disabled):focus,
    &:not(:disabled):hover{
      filter:brightness(105%);
    }

    &:not(:disabled):active{
      filter:brightness(110%);
    }
  }

  .btn--accent{
    color:white;
    background:var(--accent-color);
    border-color:var(--accent-color);
  }

  .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]{
      user-select:none;

    display:inline-flex;
    align-items:flex-end;
    
    opacity:1;

    transition:opacity 350ms linear, display 350ms allow-discrete, scale 200ms linear;

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

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

    &:has([data-state-handler]:focus-visible){
        outline:var(--focus-outline);
    }
  }
  [be-switchable]{
      user-select:none;

    cursor:pointer;
    
    color:var(--font-color-alt-2);
    border-color:var(--border-color-control);

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

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

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

  .toggle__control{
    --the-size:var(--toggle-size, 1);
    align-self:center;

    border:none;
    height:calc(.75em * var(--the-size));
    width:calc(1.5em * var(--the-size));

    position:relative;

    display:flex;
    margin:0 .5em;
    padding:0;


    & > label{
      cursor:pointer;

      height:inherit;
      width:inherit;

      position:absolute;

      display:block;

      z-index:1;

      &:has(:is([data-toggle-handler-off], [data-toggle-handler-on]):checked){
        opacity:0;
        height: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{
      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;
    }

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

      position:absolute;
      display:block;
    }
    &::before{
      background:var(--bg-color-off);
      border:var(--controls--border);
      border-radius:calc(1em * var(--the-size));

      height:calc(.5em * var(--the-size));
      width:100%;
      transition:background 200ms ease-in-out;

      transform:translate(0, 25%);
    }
    &::after{
      background:var(--bg-color-clickable);

      border:var(--controls--border);
      border-radius:50%;
      box-shadow:none;

      height:calc(.75em * var(--the-size));
      width:calc(.75em * var(--the-size));

      position:absolute;
      inset:0 calc(100% - calc(.75em * var(--the-size))) auto auto;

      transition:inset 200ms ease-in-out;
    }
  }

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

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

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

    > .toggle__control{
      margin:.5em 0;
      transform:rotate(270deg);
    }
  }
  .divider{
    align-self:stretch;

    border-color:var(--border-color-boundary);
    margin:.75rem .5rem;

    position:relative;
    inset:0;

    height:auto;
  }

    [be-divider-caption]::after{
      content:attr(be-divider-caption, 'or');

      font-size:.8rem;

      color:var(--font-color-alt-2);

      background:var(--bg-color);

      position:absolute;
      inset:auto auto auto 50%;

      padding:0;

      translate:-50% -50%;

      padding:.125rem .5rem;
    }

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

    margin:.5rem 1rem;

    :where(&)[be-divider-caption]::after{
      inset:50% auto auto;
    }
  }
  .img--fluid{
    height:auto;
    width:100%;
    max-width:100%;
    max-width:-webkit-fill-available;
    display:block;
  }

  .img--thumbnail{
    background:var(--bg-color);

    border:var(--boundary--border);
    border-radius:0.375rem;

    height:auto;
    width:100%;
    max-width:100%;
    max-width:-webkit-fill-available;

    display:block;
    padding:0.25em;
  }

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

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

    position:relative;

    display:block;
    padding:0;

    overflow:hidden;
  }

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

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

  .video--scale-1-1::before{
    padding-bottom:100%;
  }
  .navbar{
    display:flex;
    flex-flow:row wrap;

    align-items:center;

    & a{
      text-decoration:none;
    }

    > .nav > .nav__item > .nav{
      filter:var(--shadow-float-alt-1);
    }

    .navbar__toggle,
    .active-visible,
    .active-invisible{
      border-radius:50%;
      display:none;
      z-index:1;
    }
    &:has([data-toggle-navbar-handler]:checked){
      .active-invisible{
        display:none;
      }

      .active-visible{
        display:block;
      }
    }
  }

  .navbar__brand{
    display:inline-block;
  }

  .navbar__toggle{
    cursor:pointer;

    padding:.5rem;

    box-shadow:none;

    &:is(:focus, :focus-within){
      outline:var(--focus-outline);
    }
  }

  .nav{
    background:var(--bg-color);

    width:max-content;

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

    margin:0;
    padding:0;

    list-style:none;

    .nav{
      background:var(--bg-color);

      position:absolute;
      inset:100% auto auto 0;

      display:none;
      flex-flow:column nowrap;

      margin:0;
      padding:0;

      transform:translateY(-.25rem);

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

      transition:display 200ms allow-discrete, transform 200ms ease-in-out;

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

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

    display:block;
    padding:0;
  }

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

    &:has(.nav) > a::after{
      content:"";

      position:relative;
      display:inline-block;
      margin:auto auto auto 1em;

      border-right:.25em solid transparent;
      border-bottom:.25em solid currentColor;
      border-left:.25em solid transparent;

      inset:auto auto .25em auto;
      transition:transform 350ms ease-in-out;
    }

    &:hover{
      background-color:var(--bg-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 350ms 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{
    flex-flow:column;

    align-items:initial;

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

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

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

    .navbar__toggle,
    .active-invisible{
      display:block;
    }

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

      transition:display 200ms allow-discrete, margin-top 200ms ease-in-out;

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

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

        transition:margin-top 350ms ease-in-out;
      }
    }

    .nav{
      background:transparent;

      position:static;
      width:100%;

      .nav{
        width:calc(100% + 2rem);
        display:none;
        margin:.5rem -1rem -.5rem -1rem;
        padding:0 0 0 1rem;

        transition:none;
      }
    }

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

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

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

    :where(&).navbar--compact-expand,
    &:has([data-toggle-navbar-handler]:checked){
      > .nav{
        display:block;

        > .nav__item:first-child{
          margin-top:0;
        
          @starting-style{
            margin-top:-110%;
          }
        }
      }
    }
  }
  .navbar--breadcrumb{
    --breadcrumb-divider:attr(be-breadcrumb-divider, '/');

    .navbar__brand::after,
    > .nav > .nav__item:not(:last-child)::after{
      content:var(--breadcrumb-divider);

      color:var(--font-color-alt-2);

      margin:0 .5em;
    }

    > .nav > .nav__item{
      padding:0;

      &:hover{
        background:inherit;
      }
    }
  }
  .steps{
    display:grid;
    grid:max-content min-content / auto-flow 200px;
    gap:1rem;

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

    display:grid;

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

  .step__trail{
    position:relative;
    width:100%;

    display:flex;
    align-items:center;
    justify-content:center;

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

      position:absolute;

      z-index:-1;
    }

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

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

    border:0 var(--step__indicator--border-style) var(--step__indicator--border-color, var(--bg-color));
      border-width:var(--step__indicator--borders-width, 0);
    border-radius:50%;
    
    min-height:.5rem;
    min-width:.5rem;
    
    display:inline-flex;
    
    &:has(.visual-aside, .visual-indicator){
      padding:.25rem;
    }
    
    .visual-aside,
    .visual-indicator{
      translate:0;
    }
  }
  
  .step__body{
    color:var(--step__body--color, var(--font-color-alt-2));
    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{
      margin-top:.25lh;
      align-items:baseline;
      justify-content:center;

      .step:not(:last-child) &::after{
        height:calc(100% + 2.5rem);
        width:1px;
        transform:none;
      }
    }
  }
  
  .step--active{
    .step:has(~ &){
      .step__trail{
        &::before, &::after{
          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(--bg-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{
      &::before, &::after{
        background:var(--accent-color);
      }
    }
    
    .step__indicator:not(:has(.visual-aside, .visual-indicator)){
      background:var(--accent-color);

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

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

  .tab__nav{
    cursor:pointer;

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

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

    position:relative;

    padding:.25rem .75rem;

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

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

    z-index:100;
  }

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

    border:var(--boundary--border);
      border-width:1px;

    position:relative;

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

    z-index:99;
  }

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

    display:none;
  }

  .tab__content[data-tab-active],
  .tabs:has(.tab__nav:nth-child(1) [data-tab-select-handler]:checked)
    .tab__content:nth-child(1),
  .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),
  .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){
    display:block;
  }

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

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

    .tab__nav{
      border-width:1px 1px 0 0;

      border-radius:0 .125rem .125rem 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-width:0 0 1px 1px;

      border-radius:0 0 .125rem .125rem;

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

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

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

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

    .tab__nav{
      border-width:1px 0 0 1px;

      border-radius:.125rem 0 0 .125rem;

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

    .tabs__content{
      flex:1 0 auto;
      margin:0 0 0 -1px;
    }
  }
  [be-tooltip]{
    &::before{
      content:"";

      border-left:.4rem solid transparent;
      border-right:.4rem solid transparent;
      border-bottom:.4rem solid var(--bg-color-text);

      position:absolute;
      inset:0 auto auto 50%;

      opacity:0;

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

      z-index:1;

      transition:opacity 200ms ease-in-out, inset 200ms ease-in-out;
    }

    &:is(.tooltip--active)::before,
    &:is(.tooltip--focus):focus::before,
    &:hover::before{
      inset:-.5rem auto auto 50%;

      opacity:1;
    }

    &::after{
      pointer-events:none;

      font-size:.7rem;
      color:revert-layer;

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

      border-radius:.125rem;

      opacity:0;

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

      position:absolute;
      inset:auto auto 100% 50%;

      display:block;
      overflow:hidden;
      padding:.25rem .5rem;

      content:attr(be-tooltip);
      white-space:pre;
      text-overflow:ellipsis;

      transform:translateX(-50%);
      z-index:var(--z-index-tooltip);

      transition:opacity 200ms ease-in-out, inset 200ms ease-in-out;
    }

    &:is(.tooltip--active)::after,
    &:is(.tooltip--focus):focus::after,
    &:hover::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%;
    }
    
    &:is(.tooltip--active)::before,
    &:is(.tooltip--focus):focus::before,
    &:hover::before{
      inset:50% auto auto 100%;
    }

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

      transform:translateY(-50%);
    }

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

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

    &:is(.tooltip--active)::before,
    &:is(.tooltip--focus):focus::before,
    &:hover::before{
      inset:auto auto -.5rem 50%;
    }

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

      transform:translateX(-50%);
    }

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

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

    &:is(.tooltip--active)::before,
    &:is(.tooltip--focus):focus::before,
    &:hover::before{
      inset:50% 100% auto auto;
    }

    &::after{
      inset:50% 100% auto auto;
      transform:translateY(-50%);
    }
    
    &:is(.tooltip--active)::after,
    &:is(.tooltip--focus):focus::after,
    &:hover::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{
    color:var(--dialog--font-color, revert-layer);

    background:var(--dialog--bg-color, var(--bg-color));

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

    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{
    grid-area:auto / top-middle / auto / top-end;

    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:var(--dialog__header--gap, .5rem);

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

  .dialog__aside{
    grid-area:top-start / auto / bottom-start / auto;

    align-content:flex-start;
    text-align:center;

    padding:.25rem;
  }

  .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{
    color:var(--notice--font-color, revert-layer);
    
    background:var(--notice--bg-color, var(--bg-color));
    
    border:0 var(--notice--border-style, solid) var(--notice--border-color, var(--border-color-boundary));
      border-width:var(--notice--borders-width, 1px);
    border-radius:var(--notice--borders-radius, .125rem);
    
    box-shadow:var(--notice--box-shadow, );
    
    position:relative;
    
    display:flex;
    gap:.5rem;
    flex-flow:var(--notice--flex-flow, row wrap);
    
    text-align:initial;
    
    margin:auto auto 1rem;
    padding:1rem;
  }

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

  .notice__aside{
  }

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

  .notice__footer{
  }

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

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

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

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

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

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

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

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

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

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

  .notice--danger{
    background-color: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, var(--border-color-boundary));
      border-width:var(--notice--notify--borders-width, 0);
    border-radius:var(--notice--notify--borders-radius, .125rem);
    
    box-shadow:var(--shadow-float);
    
    height:auto;
    max-height:40vh;

    min-width:250px;
    width:max-content;
    max-width:clamp(250px, 100vw - 3rem, 992px);

    position:fixed;
    inset:auto auto 0 50%;

    display:none;
    flex-flow:row nowrap;
    padding:.25rem 1rem;
    padding:0 1rem;
    padding:0 .5rem;
    
    z-index:var(--z-index-popover);
    opacity:0;
    transform:translate(-50%, 0) scale(0.85);
    transition:opacity 350ms ease-in-out, transform 350ms ease-in-out, overlay 350ms allow-discrete, display 350ms allow-discrete;
    &[data-notify-open]{
      display:flex;
      opacity:1;
      transform:translate(-50%, 0) scale(1);

      @starting-style{
        opacity:0;
        transform:translate(-50%, 0) scale(0.85);
      }
    }
    
    .notice__aside{
      align-content:center;
    }
    
    .notice__content{
      margin:.5rem 0;
    }
    
    .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{
    position:relative;
    display:inline-flex;
  }

  .popper{
    --the-space:var(--popper-space, 1);
    background:var(--bg-color);

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

    position:absolute;
    inset:auto auto calc(100% + (.25rem * var(--the-space))) 50%;

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

    padding:1rem;

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

    filter:var(--shadow-float-alt-1);

    &::before{
      content:"";

      height:calc(100% + (1rem * var(--the-space)));
      width:calc(100% + (1rem * var(--the-space)));
      position:absolute;
      inset:calc(-.5rem * var(--the-space)) auto auto calc(-.5rem * var(--the-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-y:auto;
    overflow-x:hidden;
  }

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

  .popper__line::before{
    content:"";
    border:var(--boundary--border);
    border-width:0 0 1px;
    height:0;

    display:block;
    padding:0;
  }

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

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

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

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

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

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

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

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

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

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

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

  .popper--pointer{
    &::after{
      content:"";

      position:absolute;
      inset:auto auto -.375rem 50%;

      border-left:.5rem solid transparent;
      border-right:.5rem solid transparent;
      border-bottom:.5rem solid var(--bg-color);

      opacity:1;

      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;
      translate:0;
      transform:rotate(0deg);
    }

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

  .panel__header{
  }
  
  .panel__body{
    display:flex;
    gap:1rem;
    flex-flow:column nowrap;
    padding:0 .5rem;
    
    align-items:center;

    overflow:auto;

    & > *{
      position:relative;
      inset:auto;

      max-height:40vh;
      width:auto;

      margin:unset;

      transform:none;
    }
  }
    
  :where(.panel__header, .panel__body) > *{
    margin:unset
  }
  .floater{
    position:fixed;
    
    height:auto;

    min-width:280px;
    width:max-content;
    max-width:clamp(280px, calc(100% - 2rem), 640px);

    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%, 0);
  }
  
  .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%, 0);
  }

  .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%, 0);
    }
    
    .floater--bottom, .floater--bottom-right, .floater--bottom-left{
      inset:auto 50% 0;
      transform:translate(-50%, 0);
    }
  }
    
  .floater--md{
      height:clamp(13rem, 100vh - 2rem, 474px);
      max-height:revert-layer;
      width:clamp(280px, 100vw - 2rem, 610px);
      max-width:revert-layer;
  }

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

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

    visibility:collapse;

    transition:grid 350ms ease-in-out, visibility 350ms ease-in-out;

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

  .appear-sibling{
      flex:1 1 auto;
      overflow:auto;
  }

  .appear__overflow{
    overflow:hidden;
  }

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

  .appear__toggle{
    position:absolute;
    inset:0;

    z-index:-1;
  }

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

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

    &:has(> [data-appear-handler]:checked){
      grid:100% / auto 1fr;
    }
  }

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

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

    &:has(> [data-appear-handler]:checked){
      grid:auto 1fr / 100%;
    }
  }

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

    &:has(> [data-appear-handler]:checked){
      grid:100% / 1fr;
    }
  }

  .appear--fix{
    --target-size:var(--appear-size, 300px);

    grid:0 / 100%;
    max-height:initial;

    .appear__content{
    }

    &:has(> [data-appear-handler]:checked){
      grid:var(--target-size) / 100%;
    }

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

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

      &:has(> [data-appear-handler]:checked){
        grid:100% / auto var(--target-size);
      }
    }

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

      &:has(> [data-appear-handler]:checked){
        grid:auto var(--target-size) / 100%;
      }
    }

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

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

      &:has(> [data-appear-handler]:checked){
        grid:100% / var(--target-size);
      }
    }
  }
  .appear--offcanvas{
    --target-size:var(--appear-size, 300px);

    background:oklch(from var(--color-base-6) l c h / .35);
    backdrop-filter:blur(.25rem);

    max-height:initial;
    max-width:initial;
    position:fixed;
    inset:0;

    display:initial;

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

    transition:visibility 350ms ease-in-out;

    .appear__content{
      background:var(--offcanvas__content--bg-color, var(--bg-color));

      min-height:50px;
      height:auto;
      max-height:40vh;

      width:100%;
      position:absolute;

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

      translate:0 -10%;

      transition:translate 350ms ease-in-out;
    }

    &:has(> [data-appear-handler]:checked){
      visibility:visible;

      .appear__content{
        translate:0;
      }
    }

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

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

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

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

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

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

      &:is(.appear--left) .appear__content{
        height:100%;
        width:var(--target-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){
    overflow:hidden;
  }
  .accordions{
    border-radius:.125rem;

    height:var(--accordions--height, 290px);
    display:flex;

    margin:0 0 1rem;
  }

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

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

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

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

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

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

  .accordion__header{
    cursor:pointer;

    color:var(--accordion__header--font-color, revert-layer);
    background:var(--accordion__header--font-color, var(--bg-color-clickable));
    border:0 var(--accordion__header--border-style, solid) var(--accordion__header--border-color, var(--border-color-boundary));
      border-width:0 1px 0 0;

    position:relative;
    display:flex;

    justify-content:space-between;
    align-items:baseline;

    padding:1rem .5em;
    margin:0 -1px 0 0;

    writing-mode:tb;

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

    > .visual-indicator{
      transition:transform 350ms ease-in-out;
    }

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

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

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

  .accordion__content{
    position:absolute;
    inset:0;
    padding:1rem;
    overflow:clip;
    scrollbar-width:none;
    transition:scrollbar-width 1500ms allow-discrete;
  }

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

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

      transition:none;

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

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

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

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

      padding:.5rem 1em;
      margin:0 0 -1px 0;

      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;
      visibility:hidden;

      transition:grid 350ms ease-in-out, visibility 350ms ease-in-out;

      .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(--color-base-1);
    
    filter:var(--shadow-border);

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

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

  .card__media{
    & > img{
      height:100%;
      width:100%;

      display:block;

      object-fit:cover;
    }
  }

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

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

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

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

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

    .card__media:last-child{
      margin:0 calc(1rem * -1) calc(1rem * -1);
    }
  }
  
  .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:calc(1rem * -1);
    }
  }
  
  .cards--horizontal{
    grid:auto-flow minmax(min-content, auto) / repeat(auto-fill, minmax(auto, 280px) minmax(auto, 280px));

    justify-content:center;

    > .card{
      grid-area:span 3 / span 2;
      grid:subgrid / subgrid;
      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:calc(1rem * -1) -.5rem calc(1rem * -1) calc(1rem * -1);
        }

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

        &:last-child{
          margin:calc(1rem * -1) calc(1rem * -1) calc(1rem * -1) -.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{
    padding:.5rem;
    
    grid:minmax(min-content, auto) minmax(min-content, 1fr) minmax(min-content, auto) / auto-flow minmax(280px, 1fr);
    
    justify-content:normal;
    
    overflow:auto;
    -ms-scroll-snap-type:x mandatory;
    scroll-snap-type:x mandatory;
    scroll-behavior:smooth;
    
    > .card{
      grid:subgrid / subgrid;
      
      position:relative;
      
      scroll-snap-align:start;
      scroll-margin:.5rem;
    }
  }
  .cards--slide{
    height:var(--cards--slide--height, auto);
    
    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);
    
    scrollbar-width:none;
    
    &:has([data-slide-select-handler]:focus){
      box-shadow:0 0 0 .125rem var(--transparent-color);
    }
    
    .card{
      box-shadow:unset;
      margin:0 .5rem;
      
      grid-area:span 3 / span 2;
      grid:subgrid / subgrid;
      
      scroll-snap-align:center;
      scroll-margin:initial;
    }
    
    .card__content{
      background-color:var(--bg-color-text);
      
      height:fit-content;
      min-width:280px;
      min-width:fit-content;
      max-width:clamp(280px, 100% - 2rem, 65rem);
      
      grid-area:2 / 1 / -1 / -1;
      grid:auto / auto;
      margin:0 auto;
      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{
    --slide-prev-nav:attr(be-prev-nav, '<');
    --slide-next-nav:attr(be-next-nav, '>');
    
    &::scroll-button(*){
      cursor:pointer;
      
      line-height:1;

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

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

      box-shadow:var(--btn--shadow,);
      
      margin:1rem 0 1rem;
      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{
      transform:translateY(1px);
      box-shadow:none;
    }

    &::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(*){
        position:absolute;
        
        margin:initial;
        
        translate:0 -50%;
        
        z-index:1;
      }
        
      &::scroll-button(left){
        inset:50% auto auto .5rem;
      }

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

  .slide__items{
    
  }

  .slide__item{
    
  }

  .slide__navigator-prev, .slide__navigator-next{
    cursor:pointer;

    line-height:1;

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

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

    padding:.5rem;
  }

  .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{
    cursor:pointer;
    
    background:var(--bg-color-clickable);

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

    height:.375rem;
    width:1.75rem;

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

  .slide:has(.slide__item:nth-child(1) [data-slide-select-handler]:checked) .slide__indicator-item:nth-child(1),
  .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: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){
    background:var(--bg-color-off);
    
    border:0 var(--slide__indicator-item--active--border-style, solid) var(--slide__indicator-item--active--border-color, var(--border-color-boundary));
      border-width:var(--slide__indicator-item--active--borders-width, 0px);
  }
  .group,
  .group-vertical{
    display:flex;
    align-items:baseline;
  }

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

  .group__label,
  .group__input,
  .group__action{
    flex:0 0 auto;

    border-width:0;
    border-radius:unset;

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

    margin:0;

    box-shadow:none;

    &: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])){
      width:100%;
      display:block;
    }
  }

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

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

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

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

    & > *:last-child{
      border-top-right-radius:inherit;
      border-bottom-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:0px;
    }

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

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

    display:inline-block;

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

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

    margin:-.5em auto .25rem;
  }
  .form__control{
    color:var(--font-color);
    border:var(--controls--border);
    
    width:100%;

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

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

    & > :is(:first-child):is(:last-child){
      width:100%;
      margin:0;
    }

    & > *{
      border-width:0;
    }

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

    &:is(.group-vertical) > :not(: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,
  .valid-feedback,
  .invalid-feedback{
    font-size:.9em;
    display:none;
    margin-bottom:.25rem;
    :where(form[data-was-validated]) &,
    :where(.form__group:is(.data-is-valid,
                            .data-is-invalid),
           .form__group:has(.data-is-valid,
                            .data-is-invalid)) &{
      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: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,
  .form__group:has(.data-is-valid) .form__control{
    &:not(.form__control--validation-icon){
      border-color:var(--color-success-60);
    }
    
    &:not(.form__control--validation-border){
      background:var(--input--bg-color) url("data:image/svg+xml,%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.73L.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.1z'/%3e%3c/svg%3e") right .5em center/1.2em no-repeat;
      padding-right:2.25em;
    }

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

  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,
  .form__group:has(.data-is-invalid) .form__control{
    &:not(.form__control--validation-icon){
      border-color:var(--color-caution-60);
    }
    
    &:not(.form__control--validation-border){
      background:var(--input--bg-color) url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='oklch(0.58 0.15 108.19)'%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-xs, .container-sm, .container-md, .container-lg, .container-xl{
    --gutter-x:1.5rem;
    --gutter-y:0;
    container-type:inline-size;
    width:100%;
    margin:0 auto;
    padding:0 calc(var(--gutter-x) * 0.5);
  }

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

  .container-lg{
    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;
    container-type:inline-size;
    display:flex;
    flex-flow:row wrap;

    align-items:baseline;

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

  .col{
    flex:1 0 0%;
  }

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

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

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

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

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

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

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

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

  .col-8{
    flex:0 0 auto;
    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{
        min-width:auto;
        flex-flow:column nowrap;

        transition:none;

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

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

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

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

        padding:.5rem 1em;
        margin:0 0 -1px 0;

        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;
        visibility:hidden;

        transition:grid 350ms ease-in-out, visibility 350ms ease-in-out;

        .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{
        min-width:auto;
        flex-flow:column nowrap;

        transition:none;

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

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

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

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

        padding:.5rem 1em;
        margin:0 0 -1px 0;

        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;
        visibility:hidden;

        transition:grid 350ms ease-in-out, visibility 350ms ease-in-out;

        .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{
        min-width:auto;
        flex-flow:column nowrap;

        transition:none;

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

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

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

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

        padding:.5rem 1em;
        margin:0 0 -1px 0;

        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;
        visibility:hidden;

        transition:grid 350ms ease-in-out, visibility 350ms ease-in-out;

        .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;

      .navbar__toggle,
      .active-invisible{
        display:block;
      }

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

        transition:display 200ms allow-discrete, margin-top 200ms ease-in-out;

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

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

          transition:margin-top 350ms ease-in-out;
        }
      }

      .nav{
        background:transparent;

        position:static;
        width:100%;

        .nav{
          width:calc(100% + 2rem);
          display:none;
          margin:.5rem -1rem -.5rem -1rem;
          padding:0 0 0 1rem;
          
          transition:none;
        }
      }

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

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

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

      :where(&).navbar--compact-expand,
      &:has([data-toggle-navbar-handler]:checked){
        > .nav{
          display:block;

          > .nav__item:first-child{
            margin-top:0;
          
            @starting-style{
              margin-top:-110%;
            }
          }
        }
      }
    }
    .appear--vmd-offcanvas{
      --target-size:var(--appear-size, 300px);

      background:oklch(from var(--color-base-6) l c h / .35);
      backdrop-filter:blur(.25rem);

      max-height:initial;
      max-width:initial;
      position:fixed;
      inset:0;

      display:initial;

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

      transition:visibility 350ms ease-in-out;

      .appear__content{
        background:var(--offcanvas__content--bg-color, var(--bg-color));

        min-height:50px;
        height:auto;
        max-height:40vh;

        width:100%;
        position:absolute;

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

        translate:0 -10%;

        transition:translate 350ms ease-in-out;
      }

      &:has(> [data-appear-handler]:checked){
        visibility:visible;

        .appear__content{
          translate:0;
        }
      }

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

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

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

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

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

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

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

      .navbar__toggle,
      .active-invisible{
        display:block;
      }

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

        transition:display 200ms allow-discrete, margin-top 200ms ease-in-out;

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

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

          transition:margin-top 350ms ease-in-out;
        }
      }

      .nav{
        background:transparent;

        position:static;
        width:100%;

        .nav{
          width:calc(100% + 2rem);
          display:none;
          margin:.5rem -1rem -.5rem -1rem;
          padding:0 0 0 1rem;
          
          transition:none;
        }
      }

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

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

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

      :where(&).navbar--compact-expand,
      &:has([data-toggle-navbar-handler]:checked){
        > .nav{
          display:block;

          > .nav__item:first-child{
            margin-top:0;
          
            @starting-style{
              margin-top:-110%;
            }
          }
        }
      }
    }
    .appear--vsm-offcanvas{
      --target-size:var(--appear-size, 300px);

      background:oklch(from var(--color-base-6) l c h / .35);
      backdrop-filter:blur(.25rem);

      max-height:initial;
      max-width:initial;
      position:fixed;
      inset:0;

      display:initial;

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

      transition:visibility 350ms ease-in-out;

      .appear__content{
        background:var(--offcanvas__content--bg-color, var(--bg-color));

        min-height:50px;
        height:auto;
        max-height:40vh;

        width:100%;
        position:absolute;

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

        translate:0 -10%;

        transition:translate 350ms ease-in-out;
      }

      &:has(> [data-appear-handler]:checked){
        visibility:visible;

        .appear__content{
          translate:0;
        }
      }

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

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

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

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

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

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

        &:is(.appear--left) .appear__content{
          height:100%;
          width:var(--target-size);
        }
      }
    }
  }
  @media screen and (max-width: 640px){}
  [be-icon]{
    position:relative;

    display:inline-block;
    height:var(--indicator-dimension);
    width:var(--indicator-dimension);

    line-height:1;
    
    translate:0 .125em;

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

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

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

      border-right:.25em solid transparent;
      border-bottom:.25em solid currentColor;
      border-left:.25em solid transparent;
    }
  }
  [be-icon="chevron"]{
    &::after{
      content:"";

      border:0 solid currentColor;
      border-width:.125em 0 0 .125em;
      height:.5em;
      width:.5em;

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

      background:currentColor;
      border-radius:50%;

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

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

      border-bottom:.125em solid;

      width:1em;
      inset:.575em 0 auto auto;
      transform:rotate(-45deg);
    }

    &::after{
      content:"";

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

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

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

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

      border-width:0 .125em .125em 0;
      border-style:solid;

      height:.75em;
      width:.325em;

      rotate:45deg;
      inset:.5em auto auto .2em;
    }
  }
  @keyframes rotate{
    0%{
      transform:rotate(0deg);
    }
    100%{
      transform:rotate(360deg);
    }
  }

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

    &::after{
      content:"";

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

      height:.75em;
      width:.75em;

      inset:.125em auto auto .125em;

      animation:rotate 500ms infinite linear;
    }
  }
  [be-icon="rectangle"]{
    &::after{
      content:"";

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

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

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

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

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

      inset:.75em auto auto .325em;

      height:.125em;
      width:.75em;

      rotate:45deg;
    }
  }
  [be-icon="triangle"]{
    &::after{
      content:"";

      background:currentColor;
      height:.75em;
      width:.825em;

      clip-path:polygon(50% 0, 100% 100%, 0 100%);
      inset:50% auto auto 50%;
      inset:45% auto auto 50%;
    }
  }
  [be-icon="x"]{
    translate:unset;
    
    &::before,
    &::after{
      content:"";

      border:0 solid;
      border-width:0 0 .125em 0;
      border-radius:1em;
      rotate:-45deg;
      inset:.25em auto auto .45em;
      inset:.25em auto auto 25%;
      translate:25%;

      height:0;
      width:.75em;
    }

    &::before{
    }

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

    height:var(--indicator-dimension);
    width:var(--indicator-dimension);

    position:relative;
    display:inline-block;
  }

  .visual-indicator{
    font-size:calc(var(--visual-indicator--font-size) * var(--visual-indicator-size));

    height:var(--indicator-dimension);
    width:var(--indicator-dimension);

    position:relative;
    display:inline-block;
  }
  .stack{
    display:inline-flex;
    justify-content:center;
    align-items:center;
    height:2em;
    line-height:2em;
    position:relative;
    vertical-align:middle;
    width:2.5em;
  }

  .stack-1x, .stack-2x{
    left:0;
    position:absolute;
    text-align:center;
    width:100%;
    z-index:var(--stack-z-index, auto);
  }

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

  .stack-1x{
    line-height:inherit;
  }
  .placeholder{
    background:var(--bg-color-off);
    display:inline-block;
    height:1em;
    width:100%;
    vertical-align:middle;
  }
  .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;
  }
  :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 0px rgba(0, 0, 0, 0.2);
    }
    100%{
      box-shadow:0 0 0 20px rgba(0, 0, 0, 0);
    }
  }

  [be-animation="pulse"]{
    animation:pulse-animation 2s infinite;
  }
  [be-animation="rotate"]{
    animation:rotate 500ms infinite linear;
  }
  @keyframes tilt-shake{
    55%{ transform:translate(0, 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, 0) rotate(0deg); }
  }

  [be-animation="tilt-shake"]{
    animation:5s infinite tilt-shake;
  }
  .bg-none{
    background:none;
  }

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

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

  .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:var(--controls--border);
  }
  .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:.50rem;
  }

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

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

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

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

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

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

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

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

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

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

  .border-left-width-1{
    border-left-width:1rem;
  }
  .c-default{cursor:default;}
  .c-help{cursor:help;}
  .c-pointer{cursor:pointer;}
  .c-progress{cursor:progress;}
  .c-wait{cursor:wait;}
  .c-alias{cursor:alias;}
  .c-not-allowed{cursor:not-allowed;}
  .txt-white{color:white; }
  
  .txt-accent{color:var(--accent-color); }
  
  .txt-base-5{color:var(--color-base-5); }
  .txt-base-10{color:var(--color-base-10); }
  .txt-base-20{color:var(--color-base-20); }
  .txt-base-30{color:var(--color-base-30); }
  .txt-base-40{color:var(--color-base-40); }
  .txt-base-50{color:var(--color-base-50);}
  .txt-base-60{color:var(--color-base-60); }
  .txt-base-70{color:var(--color-base-70); }
  .txt-base-80{color:var(--color-base-80); }
  .txt-base-90{color:var(--color-base-90); }

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

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

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

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

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

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

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

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

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

  .txt-danger-5{color:var(--color-danger-5); }
  .txt-danger-10{color:var(--color-danger-10); }
  .txt-danger-20{color:var(--color-danger-20); }
  .txt-danger-30{color:var(--color-danger-30); }
  .txt-danger-40{color:var(--color-danger-40); }
  .txt-danger-50{color:var(--color-danger-50); }
  .txt-danger-60{color:var(--color-danger-60); }
  .txt-danger-70{color:var(--color-danger-70); }
  .txt-danger-80{color:var(--color-danger-80); }
  .txt-danger-90{color:var(--color-danger-90); }
  .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:0.25;
  }

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

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

  .opacity-1{
    opacity:1;
  }
  .invisible{
    position:absolute;
    height:0;
    width:0;

    opacity:0;
    overflow:auto;
    overflow:clip;
  }

  .visible{
    position:static;
    height:auto;
    width:auto;

    opacity:1;
    overflow:initial;
  }
  .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;
  }

  .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;
  }
  .d-none{display:none;}
  .d-block{display:block;}
  .d-inline{display:inline;}
  .d-inline-block{display:inline-block;}
  .d-inline-flex{display:inline-flex;}
  .d-inline-grid{display:inline-grid;}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

  .overflow-clip{
    overflow:clip;
  }

  .overflow-hidden{
    overflow:hidden;
  }

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

  .rotate-45{
    rotate:45deg;
  }

  .rotate-90{
    rotate:90deg;
  }

  .rotate-135{
    rotate:135deg;
  }

  .rotate-180{
    rotate:180deg;
  }
  
  .clearfix::after{
    clear:both;
    content:"";
    display:table;
  }
  .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-stretch{
    align-content:space-around;
  }

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

  .stretch::after{
    content:"";

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

  .grid-column-span-4{
    grid-column-start:span 4;
    grid-column-end:auto;
  }
  .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{
      font-size:clamp(4rem, calc(4rem + 0.125vw), 4.5rem);
  }

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

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

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

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

  .header-6{
      font-size:clamp(1.5rem, calc(1.5rem + 0.125vw), 2rem);
  }
  .subheader,
  .subtext{
    opacity:.8;
    display:block;
    margin:.5em 0;
  }

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

  .subtext{
    font-size:.8rem;
  }
  .font-size-\.1{
    font-size:.10rem;
  }

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

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

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

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

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

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

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

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

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

  .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;
  }
  .line-height-1{
    line-height:1;
  }

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

  .line-height-1\.2{
    line-height:1.2;
  }

  .line-height-1\.3{
    line-height:1.3;
  }

  .line-height-1\.4{
    line-height:1.4;
  }

  .line-height-1\.5{
    line-height:1.5;
  }

  .line-height-1\.6{
    line-height:1.6;
  }
  @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){
    .invisible-vmd{
        position:absolute;
        height:0;
        width:0;

        opacity:0;
        overflow:auto;
        overflow:clip;
    }

    .visible-vmd{
        position:static;
        height:auto;
        width:auto;

        opacity:1;
        overflow:initial;
    }
  }

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

        opacity:0;
        overflow:auto;
        overflow:clip;
    }

    .visible-vsm{
        position:static;
        height:auto;
        width:auto;

        opacity:1;
        overflow:initial;
    }
  }

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