*, :before, :after {
    box-sizing: border-box;
    border-width: 0;
    border-style: solid;
    border-color:#e5e7eb
}

:before, :after {
    --tw-content: ""
}

html, :host {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    font-family: Inter, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", Segoe UI Symbol, "Noto Color Emoji";
    font-feature-settings: normal;
    font-variation-settings: normal;
    -webkit-tap-highlight-color:transparent
}

body {
    margin: 0;
    line-height:inherit
}

hr {
    height: 0;
    color: inherit;
    border-top-width:1px
}

abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration:underline dotted
}

h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight:inherit
}

a {
    color: inherit;
    text-decoration:inherit
}

b, strong {
    font-weight:bolder
}

code, kbd, samp, pre {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
    font-feature-settings: normal;
    font-variation-settings: normal;
    font-size:1em
}

small {
    font-size:80%
}

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

sub {
    bottom:-.25em
}

sup {
    top:-.5em
}

table {
    text-indent: 0;
    border-color: inherit;
    border-collapse:collapse
}

button, input, optgroup, select, textarea {
    font-family: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    font-size: 100%;
    font-weight: inherit;
    line-height: inherit;
    letter-spacing: inherit;
    color: inherit;
    margin: 0;
    padding:0
}

button, select {
    text-transform:none
}

button, input:where([type=button]), input:where([type=reset]), input:where([type=submit]) {
    -webkit-appearance: button;
    background-color: transparent;
    background-image:none
}

:-moz-focusring {
    outline:auto
}

:-moz-ui-invalid {
    box-shadow:none
}

progress {
    vertical-align:baseline
}

::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
    height:auto
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset:-2px
}

::-webkit-search-decoration {
    -webkit-appearance:none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font:inherit
}

summary {
    display:list-item
}

blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre {
    margin:0
}

fieldset {
    margin: 0;
    padding:0
}

legend {
    padding:0
}

ol, ul, menu {
    list-style: none;
    margin: 0;
    padding:0
}

dialog {
    padding:0
}

textarea {
    resize:vertical
}

input::placeholder, textarea::placeholder {
    opacity: 1;
    color:#9ca3af
}

button, [role=button] {
    cursor:pointer
}

:disabled {
    cursor:default
}

img, svg, video, canvas, audio, iframe, embed, object {
    display: block;
    vertical-align:middle
}

img, video {
    max-width: 100%;
    height:auto
}

[hidden] {
    display:none
}

*, :before, :after {
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-pan-x:;
    --tw-pan-y:;
    --tw-pinch-zoom:;
    --tw-scroll-snap-strictness: proximity;
    --tw-gradient-from-position:;
    --tw-gradient-via-position:;
    --tw-gradient-to-position:;
    --tw-ordinal:;
    --tw-slashed-zero:;
    --tw-numeric-figure:;
    --tw-numeric-spacing:;
    --tw-numeric-fraction:;
    --tw-ring-inset:;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgb(59 130 246 / .5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-blur:;
    --tw-brightness:;
    --tw-contrast:;
    --tw-grayscale:;
    --tw-hue-rotate:;
    --tw-invert:;
    --tw-saturate:;
    --tw-sepia:;
    --tw-drop-shadow:;
    --tw-backdrop-blur:;
    --tw-backdrop-brightness:;
    --tw-backdrop-contrast:;
    --tw-backdrop-grayscale:;
    --tw-backdrop-hue-rotate:;
    --tw-backdrop-invert:;
    --tw-backdrop-opacity:;
    --tw-backdrop-saturate:;
    --tw-backdrop-sepia:;
    --tw-contain-size:;
    --tw-contain-layout:;
    --tw-contain-paint:;
    --tw-contain-style:
}

::backdrop {
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-pan-x:;
    --tw-pan-y:;
    --tw-pinch-zoom:;
    --tw-scroll-snap-strictness: proximity;
    --tw-gradient-from-position:;
    --tw-gradient-via-position:;
    --tw-gradient-to-position:;
    --tw-ordinal:;
    --tw-slashed-zero:;
    --tw-numeric-figure:;
    --tw-numeric-spacing:;
    --tw-numeric-fraction:;
    --tw-ring-inset:;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgb(59 130 246 / .5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-blur:;
    --tw-brightness:;
    --tw-contrast:;
    --tw-grayscale:;
    --tw-hue-rotate:;
    --tw-invert:;
    --tw-saturate:;
    --tw-sepia:;
    --tw-drop-shadow:;
    --tw-backdrop-blur:;
    --tw-backdrop-brightness:;
    --tw-backdrop-contrast:;
    --tw-backdrop-grayscale:;
    --tw-backdrop-hue-rotate:;
    --tw-backdrop-invert:;
    --tw-backdrop-opacity:;
    --tw-backdrop-saturate:;
    --tw-backdrop-sepia:;
    --tw-contain-size:;
    --tw-contain-layout:;
    --tw-contain-paint:;
    --tw-contain-style:
}

.container {
    width:100%
}

@media (min-width: 640px) {
    .container {
        max-width:640px
    }
}

@media (min-width: 768px) {
    .container {
        max-width:768px
    }
}

@media (min-width: 1024px) {
    .container {
        max-width:1024px
    }
}

@media (min-width: 1280px) {
    .container {
        max-width:1280px
    }
}

@media (min-width: 1536px) {
    .container {
        max-width:1536px
    }
}

.pointer-events-none {
    pointer-events:none
}

.pointer-events-auto {
    pointer-events:auto
}

.visible {
    visibility:visible
}

.invisible {
    visibility:hidden
}

.static {
    position:static
}

.fixed {
    position:fixed
}

.absolute {
    position:absolute
}

.relative {
    position:relative
}

.sticky {
    position:sticky
}

.inset-0 {
    inset:0
}

.bottom-0 {
    bottom:0
}

.bottom-5 {
    bottom:1.25rem
}

.left-0 {
    left:0
}

.left-0\.5 {
    left:.125rem
}

.left-1 {
    left:.25rem
}

.left-1\/2 {
    left:50%
}

.left-2 {
    left:.5rem
}

.left-5 {
    left:1.25rem
}

.right-0 {
    right:0
}

.right-5 {
    right:1.25rem
}

.top-0 {
    top:0
}

.top-0\.5 {
    top:.125rem
}

.top-1\/2 {
    top:50%
}

.top-2 {
    top:.5rem
}

.top-px {
    top:1px
}

.isolate {
    isolation:isolate
}

.z-10 {
    z-index:10
}

.z-20 {
    z-index:20
}

.z-\[1\] {
    z-index:1
}

.m-auto {
    margin:auto
}

.mx-0 {
    margin-left: 0;
    margin-right:0
}

.mx-3 {
    margin-left: .75rem;
    margin-right:.75rem
}

.mx-5 {
    margin-left: 1.25rem;
    margin-right:1.25rem
}

.mx-auto {
    margin-left: auto;
    margin-right:auto
}

.my-0 {
    margin-top: 0;
    margin-bottom:0
}

.my-2 {
    margin-top: .5rem;
    margin-bottom:.5rem
}

.my-3 {
    margin-top: .75rem;
    margin-bottom:.75rem
}

.my-32 {
    margin-top: 8rem;
    margin-bottom:8rem
}

.my-5 {
    margin-top: 1.25rem;
    margin-bottom:1.25rem
}

.my-7 {
    margin-top: 1.75rem;
    margin-bottom:1.75rem
}

.my-8 {
    margin-top: 2rem;
    margin-bottom:2rem
}

.-mr-3 {
    margin-right:-.75rem
}

.mb-1 {
    margin-bottom:.25rem
}

.mb-10 {
    margin-bottom:2.5rem
}

.mb-2 {
    margin-bottom:.5rem
}

.mb-2\.5 {
    margin-bottom:.625rem
}

.mb-28 {
    margin-bottom:7rem
}

.mb-3 {
    margin-bottom:.75rem
}

.mb-4 {
    margin-bottom:1rem
}

.mb-5 {
    margin-bottom:1.25rem
}

.mb-5\.5 {
    margin-bottom:1.375rem
}

.mb-7 {
    margin-bottom:1.75rem
}

.mb-8 {
    margin-bottom:2rem
}

.ml-1 {
    margin-left:.25rem
}

.ml-2 {
    margin-left:.5rem
}

.ml-2\.5 {
    margin-left:.625rem
}

.ml-4 {
    margin-left:1rem
}

.ml-5 {
    margin-left:1.25rem
}

.ml-auto {
    margin-left:auto
}

.mr-2 {
    margin-right:.5rem
}

.mr-2\.5 {
    margin-right:.625rem
}

.mr-4 {
    margin-right:1rem
}

.mr-6 {
    margin-right:1.5rem
}

.mr-auto {
    margin-right:auto
}

.mt-0 {
    margin-top:0
}

.mt-0\.5 {
    margin-top:.125rem
}

.mt-10 {
    margin-top:2.5rem
}

.mt-20 {
    margin-top:5rem
}

.mt-3 {
    margin-top:.75rem
}

.mt-4 {
    margin-top:1rem
}

.mt-5 {
    margin-top:1.25rem
}

.mt-5\.5 {
    margin-top:1.375rem
}

.mt-7 {
    margin-top:1.75rem
}

.mt-8 {
    margin-top:2rem
}

.mt-\[5\.5rem\] {
    margin-top:5.5rem
}

.block {
    display:block
}

.inline {
    display:inline
}

.flex {
    display:flex
}

.table {
    display:table
}

.list-item {
    display:list-item
}

.hidden {
    display:none
}

.\ !h-4 {
    height:1rem !important
}

.h-10 {
    height:2.5rem
}

.h-12 {
    height:3rem
}

.h-12\.5 {
    height:3.125rem
}

.h-14 {
    height:3.5rem
}

.h-15 {
    height:3.75rem
}

.h-2 {
    height:.5rem
}

.h-24 {
    height:6rem
}

.h-4 {
    height:1rem
}

.h-5 {
    height:1.25rem
}

.h-6 {
    height:1.5rem
}

.h-8 {
    height:2rem
}

.h-\[7\.5rem\] {
    height:7.5rem
}

.h-auto {
    height:auto
}

.h-full {
    height:100%
}

.max-h-\[31\.875rem\] {
    max-height:31.875rem
}

.max-h-dvh {
    max-height:100dvh
}

.min-h-10 {
    min-height:2.5rem
}

.min-h-14 {
    min-height:3.5rem
}

.min-h-15 {
    min-height:3.75rem
}

.min-h-6 {
    min-height:1.5rem
}

.\ !w-4 {
    width:1rem !important
}

.\ !w-full {
    width:100% !important
}

.w-10 {
    width:2.5rem
}

.w-24 {
    width:6rem
}

.w-4 {
    width:1rem
}

.w-5 {
    width:1.25rem
}

.w-6 {
    width:1.5rem
}

.w-8 {
    width:2rem
}

.w-\[228px\] {
    width:228px
}

.w-\[7\.5rem\] {
    width:7.5rem
}

.w-\[7\.75rem\] {
    width:7.75rem
}

.w-\[8\.75rem\] {
    width:8.75rem
}

.w-\[calc\(100\%_-_2\.5rem\)\] {
    width:calc(100% - 2.5rem)
}

.w-\[calc\(100vw-4\.75rem\)\] {
    width:calc(100vw - 4.75rem)
}

.w-fit {
    width:fit-content
}

.w-full {
    width:100%
}

.min-w-10 {
    min-width:2.5rem
}

.min-w-24 {
    min-width:6rem
}

.min-w-48 {
    min-width:12rem
}

.min-w-6 {
    min-width:1.5rem
}

.min-w-\[23\.375rem\] {
    min-width:23.375rem
}

.max-w-96 {
    max-width:24rem
}

.max-w-\[25rem\] {
    max-width:25rem
}

.max-w-\[26\.875rem\] {
    max-width:26.875rem
}

.max-w-\[27\.5rem\] {
    max-width:27.5rem
}

.max-w-\[28\.375rem\] {
    max-width:28.375rem
}

.max-w-\[30rem\] {
    max-width:30rem
}

.max-w-\[8\.75rem\] {
    max-width:8.75rem
}

.max-w-full {
    max-width:100%
}

.flex-1 {
    flex:1 1 0%
}

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

.shrink {
    flex-shrink:1
}

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

.-translate-y-\[50\%\] {
    --tw-translate-y: -50%;
    transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.rotate-180 {
    --tw-rotate: 180deg;
    transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.transform {
    transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.cursor-pointer {
    cursor:pointer
}

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

.resize {
    resize:both
}

.flex-row {
    flex-direction:row
}

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

.flex-col {
    flex-direction:column
}

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

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

.items-center {
    align-items:center
}

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

.justify-center {
    justify-content:center
}

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

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

.gap-1 {
    gap:.25rem
}

.gap-10 {
    gap:2.5rem
}

.gap-12 {
    gap:3rem
}

.gap-16 {
    gap:4rem
}

.gap-2 {
    gap:.5rem
}

.gap-2\.5 {
    gap:.625rem
}

.gap-4 {
    gap:1rem
}

.gap-5 {
    gap:1.25rem
}

.gap-9 {
    gap:2.25rem
}

.gap-x-1 {
    column-gap:.25rem
}

.gap-x-2 {
    column-gap:.5rem
}

.gap-x-5 {
    column-gap:1.25rem
}

.gap-y-10 {
    row-gap:2.5rem
}

.gap-y-5 {
    row-gap:1.25rem
}

.justify-self-center {
    justify-self:center
}

.overflow-auto {
    overflow:auto
}

.overflow-hidden {
    overflow:hidden
}

.overflow-clip {
    overflow:clip
}

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

.overflow-x-hidden {
    overflow-x:hidden
}

.overscroll-contain {
    overscroll-behavior:contain
}

.overflow-ellipsis, .text-ellipsis {
    text-overflow:ellipsis
}

.whitespace-nowrap {
    white-space:nowrap
}

.whitespace-pre {
    white-space:pre
}

.rounded {
    border-radius:.25rem
}

.rounded-2xl {
    border-radius:1rem
}

.rounded-\[1\.25rem\] {
    border-radius:1.25rem
}

.rounded-\[12\.5rem\] {
    border-radius:12.5rem
}

.rounded-\[inherit\] {
    border-radius:inherit
}

.rounded-full {
    border-radius:9999px
}

.rounded-md {
    border-radius:.375rem
}

.rounded-xl {
    border-radius:.75rem
}

.border {
    border-width:1px
}

.border-2 {
    border-width:2px
}

.border-solid {
    border-style:solid
}

.border-\[var\(--text-tertiary\)\] {
    border-color:var(--text-tertiary)
}

.border-neutral-100 {
    border-color:var(--sui-color-neutral-100)
}

.border-transparent {
    border-color:var(--sui-color-transparent)
}

.bg-\[\#202124\] {
    --tw-bg-opacity: 1;
    background-color:rgb(32 33 36 / var(--tw-bg-opacity))
}

.bg-\[\#F5F6F9\] {
    --tw-bg-opacity: 1;
    background-color:rgb(245 246 249 / var(--tw-bg-opacity))
}

.bg-\[\#d9d9d9\] {
    --tw-bg-opacity: 1;
    background-color:rgb(217 217 217 / var(--tw-bg-opacity))
}

.bg-\[var\(--background-success\)\] {
    background-color:var(--background-success)
}

.bg-black {
    --tw-bg-opacity: 1;
    background-color:rgb(0 0 0 / var(--tw-bg-opacity))
}

.bg-dark-20 {
    background-color:var(--sui-color-dark-20)
}

.bg-neutral-100 {
    background-color:var(--sui-color-neutral-100)
}

.bg-transparent {
    background-color:var(--sui-color-transparent)
}

.bg-white {
    background-color:var(--sui-color-white)
}

.bg-opacity-20 {
    --tw-bg-opacity: .2
}

.object-cover {
    object-fit:cover
}

.\ !p-0 {
    padding:0 !important
}

.p-3 {
    padding:.75rem
}

.p-5 {
    padding:1.25rem
}

.px-0 {
    padding-left: 0;
    padding-right:0
}

.px-10 {
    padding-left: 2.5rem;
    padding-right:2.5rem
}

.px-12 {
    padding-left: 3rem;
    padding-right:3rem
}

.px-2 {
    padding-left: .5rem;
    padding-right:.5rem
}

.px-4 {
    padding-left: 1rem;
    padding-right:1rem
}

.px-5 {
    padding-left: 1.25rem;
    padding-right:1.25rem
}

.px-6 {
    padding-left: 1.5rem;
    padding-right:1.5rem
}

.px-7 {
    padding-left: 1.75rem;
    padding-right:1.75rem
}

.px-8 {
    padding-left: 2rem;
    padding-right:2rem
}

.px-\[1\.125rem\] {
    padding-left: 1.125rem;
    padding-right:1.125rem
}

.py-0 {
    padding-top: 0;
    padding-bottom:0
}

.py-0\.5 {
    padding-top: .125rem;
    padding-bottom:.125rem
}

.py-10 {
    padding-top: 2.5rem;
    padding-bottom:2.5rem
}

.py-2 {
    padding-top: .5rem;
    padding-bottom:.5rem
}

.py-2\.5 {
    padding-top: .625rem;
    padding-bottom:.625rem
}

.py-3 {
    padding-top: .75rem;
    padding-bottom:.75rem
}

.py-3\.5 {
    padding-top: .875rem;
    padding-bottom:.875rem
}

.py-4 {
    padding-top: 1rem;
    padding-bottom:1rem
}

.py-4\.5 {
    padding-top: 1.125rem;
    padding-bottom:1.125rem
}

.py-5 {
    padding-top: 1.25rem;
    padding-bottom:1.25rem
}

.pb-2 {
    padding-bottom:.5rem
}

.pb-24 {
    padding-bottom:6rem
}

.pb-3 {
    padding-bottom:.75rem
}

.pb-4 {
    padding-bottom:1rem
}

.pb-5 {
    padding-bottom:1.25rem
}

.pb-6 {
    padding-bottom:1.5rem
}

.pb-8 {
    padding-bottom:2rem
}

.pb-\[8\.5rem\] {
    padding-bottom:8.5rem
}

.pl-3 {
    padding-left:.75rem
}

.pl-5 {
    padding-left:1.25rem
}

.pr-2 {
    padding-right:.5rem
}

.pr-3 {
    padding-right:.75rem
}

.pr-5 {
    padding-right:1.25rem
}

.pt-0 {
    padding-top:0
}

.pt-0\.5 {
    padding-top:.125rem
}

.pt-10 {
    padding-top:2.5rem
}

.pt-16 {
    padding-top:4rem
}

.pt-3 {
    padding-top:.75rem
}

.pt-5 {
    padding-top:1.25rem
}

.pt-6 {
    padding-top:1.5rem
}

.pt-\[14\.5rem\] {
    padding-top:14.5rem
}

.text-left {
    text-align:left
}

.text-center {
    text-align:center
}

.align-middle {
    vertical-align:middle
}

.font-rothorn {
    font-family:RothornVariable, Verdana, Tahoma, sans-serif
}

.font-sans {
    font-family: Inter, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", Segoe UI Symbol, "Noto Color Emoji"
}

.text-\[1\.0625rem\] {
    font-size:1.0625rem
}

.text-body-l {
    font-size: 1.0625rem;
    line-height: 1.25rem;
    font-weight:400
}

.text-body-m {
    font-size: .9375rem;
    line-height: 1.125rem;
    font-weight:400
}

.text-body-s {
    font-size: .8125rem;
    line-height: 1rem;
    font-weight:400
}

.text-heading-l {
    font-size: 1.875rem;
    line-height: 2.5rem;
    font-weight:650
}

.text-heading-m {
    font-size: 1.25rem;
    line-height: 1.5rem;
    font-weight:650
}

.text-heading-xs {
    font-size: .9375rem;
    line-height: 1.125rem;
    font-weight:600
}

.font-bold {
    font-weight:700
}

.font-medium {
    font-weight:500
}

.font-semibold {
    font-weight:600
}

.italic {
    font-style:italic
}

.leading-5 {
    line-height:1.25rem
}

.tracking-\[-0\.0275rem\] {
    letter-spacing:-.0275rem
}

.tracking-normal {
    letter-spacing:0em
}

.text-\[\#171c2673\] {
    color:#171c2673
}

.text-\[\#8ab4f8\] {
    --tw-text-opacity: 1;
    color:rgb(138 180 248 / var(--tw-text-opacity))
}

.text-\[--foreground-accent\] {
    color:var(--foreground-accent)
}

.text-\[initial\] {
    color:initial
}

.text-\[var\(--sui-color-success-100\)\] {
    color:var(--sui-color-success-100)
}

.text-accent-120 {
    color:var(--sui-color-accent-120)
}

.text-brand-100 {
    color:var(--sui-color-brand-100)
}

.text-inherit {
    color:inherit
}

.text-red-600 {
    --tw-text-opacity: 1;
    color:rgb(220 38 38 / var(--tw-text-opacity))
}

.text-secondary {
    color:var(--sui-color-secondary)
}

.text-stop-120 {
    color:var(--sui-color-stop-120)
}

.text-tertiary {
    color:var(--sui-color-tertiary)
}

.text-white {
    color:var(--sui-color-white)
}

.underline {
    text-decoration-line:underline
}

.no-underline {
    text-decoration-line:none
}

.opacity-30 {
    opacity:.3
}

.opacity-45 {
    opacity:.45
}

.shadow-m {
    --tw-shadow: 0px 6px 34px 0px rgba(32, 47, 78, .12);
    --tw-shadow-colored: 0px 6px 34px 0px var(--tw-shadow-color);
    box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.shadow-xs {
    --tw-shadow: 0px 4px 8px 0px rgba(38, 48, 64, .12);
    --tw-shadow-colored: 0px 4px 8px 0px var(--tw-shadow-color);
    box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.outline {
    outline-style:solid
}

.blur {
    --tw-blur: blur(8px);
    filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
}

.filter {
    filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
}

.backdrop-blur-md {
    --tw-backdrop-blur: blur(12px);
    -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
    backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)
}

.transition {
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    transition-duration:.15s
}

.transition-colors {
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    transition-duration:.15s
}

.transition-transform {
    transition-property: transform;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    transition-duration:.15s
}

.ease-in-out {
    transition-timing-function:cubic-bezier(.4, 0, .2, 1)
}

.cdk-overlay-container, .cdk-global-overlay-wrapper {
    pointer-events: none;
    top: 0;
    left: 0;
    height: 100%;
    width:100%
}

.cdk-overlay-container {
    position: fixed;
    z-index:1000
}

.cdk-overlay-container:empty {
    display:none
}

.cdk-global-overlay-wrapper {
    display: flex;
    position: absolute;
    z-index:1000
}

.cdk-overlay-pane {
    position: absolute;
    pointer-events: auto;
    box-sizing: border-box;
    display: flex;
    max-width: 100%;
    max-height: 100%;
    z-index:1000
}

.cdk-overlay-backdrop {
    position: absolute;
    inset: 0;
    pointer-events: auto;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    opacity: 0;
    z-index: 1000;
    transition:opacity .4s cubic-bezier(.25, .8, .25, 1)
}

.cdk-overlay-backdrop-showing {
    opacity:1
}

@media (forced-colors: active) {
    .cdk-overlay-backdrop-showing {
        opacity:.6
    }
}

.cdk-overlay-dark-backdrop {
    background:#00000052
}

.cdk-overlay-transparent-backdrop {
    transition: visibility 1ms linear, opacity 1ms linear;
    visibility: hidden;
    opacity:1
}

.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing, .cdk-high-contrast-active .cdk-overlay-transparent-backdrop {
    opacity: 0;
    visibility:visible
}

.cdk-overlay-backdrop-noop-animation {
    transition:none
}

.cdk-overlay-connected-position-bounding-box {
    position: absolute;
    display: flex;
    flex-direction: column;
    min-width: 1px;
    min-height: 1px;
    z-index:1000
}

.cdk-global-scrollblock {
    position: fixed;
    width: 100%;
    overflow-y:scroll
}

.sui-button {
    transition-property: background-color, color;
    transition-duration: .15s;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor:pointer
}

.sui-button:active:disabled, .sui-button:active[aria-disabled=true] {
    pointer-events:none
}

.sui-button:after {
    transition-property: border-color, border-width;
    transition-duration: .15s;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    position: absolute;
    inset: 0;
    content: "";
    border-radius: inherit;
    border: var(--sui-button-border-width) solid var(--sui-border-color);
    color: transparent;
    will-change: border-color, border-width;
    pointer-events: none
}

.sui-button[data-appearance=""], .sui-button[data-appearance=primary] {
    background-color: var(--sui-color-brand-100);
    color: var(--sui-color-white)
}

.sui-button[data-appearance=""]:focus-visible, .sui-button[data-appearance=primary]:focus-visible {
    outline: none
}

.sui-button[data-appearance=""]:focus-visible.sui-has-border, .sui-button[data-appearance=primary]:focus-visible.sui-has-border {
    --sui-button-border-width: 2px;
    --sui-border-color: var(--sui-color-accent-100)
}

.sui-button[data-appearance=""][data-sui-long-press-button=true], .sui-button[data-appearance=primary][data-sui-long-press-button=true] {
    background: linear-gradient(to right, var(--sui-color-brand-100) 0%, var(--sui-color-brand-100) 100%);
    background-size: 200% 100%;
    background-position: 100% 0;
    will-change: background-position;
    -webkit-user-select: none;
    user-select: none;
    -webkit-touch-callout: none
}

.sui-button[data-appearance=""][data-sui-long-press-button=true][data-sui-long-press-finished=true], .sui-button[data-appearance=primary][data-sui-long-press-button=true][data-sui-long-press-finished=true] {
    background:linear-gradient(to right, var(--sui-color-brand-120) 0%, var(--sui-color-brand-120) 100%)
}

@media (hover: hover) {
    .sui-button[data-appearance=""][data-sui-long-press-button=true][data-sui-long-press-finished=false]:hover, .sui-button[data-appearance=primary][data-sui-long-press-button=true][data-sui-long-press-finished=false]:hover {
        background: linear-gradient(to right, var(--sui-color-brand-120) 0%, var(--sui-color-brand-120) 50%, var(--sui-color-brand-80) 50%, var(--sui-color-brand-80) 100%);
        background-size: 200% 100%;
        background-position: 100% 0;
        transition: var(--sui-long-press-duration, .3s) ease-in-out
    }
}

.sui-button[data-appearance=""][data-sui-long-press-button=true][data-sui-long-press-finished=false]:active, .sui-button[data-appearance=primary][data-sui-long-press-button=true][data-sui-long-press-finished=false]:active {
    background: linear-gradient(to right, var(--sui-color-brand-120) 0%, var(--sui-color-brand-120) 50%, var(--sui-color-brand-80) 50%, var(--sui-color-brand-80) 100%);
    background-size: 200% 100%;
    background-position: 0 0;
    transition:var(--sui-long-press-duration, .3s) ease-in-out
}

@media (hover: hover) {
    .sui-button[data-appearance=""]:hover, .sui-button[data-appearance=primary]:hover {
        background-color: var(--sui-color-brand-80)
    }
}

.sui-button[data-appearance=""]:active, .sui-button[data-appearance=primary]:active {
    background-color: var(--sui-color-brand-120)
}

.sui-button[data-appearance=""]:disabled, .sui-button[data-appearance=primary]:disabled {
    background-color: var(--sui-color-neutral-100);
    color: var(--sui-color-secondary)
}

.sui-button[data-appearance=""]:disabled.sui-has-border, .sui-button[data-appearance=primary]:disabled.sui-has-border {
    --sui-button-border-width: 1px;
    --sui-border-color: var(--sui-color-tertiary)
}

.sui-button[data-appearance=secondary] {
    background-color: var(--sui-color-neutral-100);
    color:var(--sui-color-primary)
}

.sui-button[data-appearance=secondary]:focus-visible {
    outline:none
}

.sui-button[data-appearance=secondary]:focus-visible.sui-has-border {
    --sui-button-border-width: 2px;
    --sui-border-color: var(--sui-color-accent-100)
}

.sui-button[data-appearance=secondary][data-sui-long-press-button=true] {
    background: linear-gradient(to right, var(--sui-color-neutral-100) 0%, var(--sui-color-neutral-100) 100%);
    background-size: 200% 100%;
    background-position: 100% 0;
    will-change: background-position;
    -webkit-user-select: none;
    user-select: none;
    -webkit-touch-callout:none
}

.sui-button[data-appearance=secondary][data-sui-long-press-button=true][data-sui-long-press-finished=true] {
    background:linear-gradient(to right, var(--sui-color-neutral-120) 0%, var(--sui-color-neutral-120) 100%)
}

@media (hover: hover) {
    .sui-button[data-appearance=secondary][data-sui-long-press-button=true][data-sui-long-press-finished=false]:hover {
        background: linear-gradient(to right, var(--sui-color-neutral-120) 0%, var(--sui-color-neutral-120) 50%, var(--sui-color-neutral-100) 50%, var(--sui-color-neutral-100) 100%);
        background-size: 200% 100%;
        background-position: 100% 0;
        transition:var(--sui-long-press-duration, .3s) ease-in-out
    }
}

.sui-button[data-appearance=secondary][data-sui-long-press-button=true][data-sui-long-press-finished=false]:active {
    background: linear-gradient(to right, var(--sui-color-neutral-120) 0%, var(--sui-color-neutral-120) 50%, var(--sui-color-neutral-100) 50%, var(--sui-color-neutral-100) 100%);
    background-size: 200% 100%;
    background-position: 0 0;
    transition:var(--sui-long-press-duration, .3s) ease-in-out
}

@media (hover: hover) {
    .sui-button[data-appearance=secondary]:hover {
        background-color:var(--sui-color-neutral-100)
    }
}

.sui-button[data-appearance=secondary]:active {
    background-color:var(--sui-color-neutral-120)
}

.sui-button[data-appearance=secondary]:disabled {
    background-color: var(--sui-color-neutral-100);
    color:var(--sui-color-secondary)
}

.sui-button[data-appearance=secondary]:disabled.sui-has-border {
    --sui-button-border-width: 1px;
    --sui-border-color: var(--sui-color-tertiary)
}

.sui-button[data-appearance=tertiary] {
    background-color: var(--sui-color-transparent);
    color:var(--sui-color-primary)
}

.sui-button[data-appearance=tertiary]:focus-visible {
    outline:none
}

.sui-button[data-appearance=tertiary]:focus-visible.sui-has-border {
    --sui-button-border-width: 2px;
    --sui-border-color: var(--sui-color-accent-100)
}

.sui-button[data-appearance=tertiary][data-sui-long-press-button=true] {
    background: linear-gradient(to right, var(--sui-color-transparent) 0%, var(--sui-color-transparent) 100%);
    background-size: 200% 100%;
    background-position: 100% 0;
    will-change: background-position;
    -webkit-user-select: none;
    user-select: none;
    -webkit-touch-callout:none
}

.sui-button[data-appearance=tertiary][data-sui-long-press-button=true][data-sui-long-press-finished=true] {
    background:linear-gradient(to right, var(--sui-color-neutral-100) 0%, var(--sui-color-neutral-100) 100%)
}

@media (hover: hover) {
    .sui-button[data-appearance=tertiary][data-sui-long-press-button=true][data-sui-long-press-finished=false]:hover {
        background: linear-gradient(to right, var(--sui-color-neutral-100) 0%, var(--sui-color-neutral-100) 50%, var(--sui-color-neutral-80) 50%, var(--sui-color-neutral-80) 100%);
        background-size: 200% 100%;
        background-position: 100% 0;
        transition:var(--sui-long-press-duration, .3s) ease-in-out
    }
}

.sui-button[data-appearance=tertiary][data-sui-long-press-button=true][data-sui-long-press-finished=false]:active {
    background: linear-gradient(to right, var(--sui-color-neutral-100) 0%, var(--sui-color-neutral-100) 50%, var(--sui-color-neutral-80) 50%, var(--sui-color-neutral-80) 100%);
    background-size: 200% 100%;
    background-position: 0 0;
    transition:var(--sui-long-press-duration, .3s) ease-in-out
}

@media (hover: hover) {
    .sui-button[data-appearance=tertiary]:hover {
        background-color:var(--sui-color-neutral-80)
    }
}

.sui-button[data-appearance=tertiary]:active {
    background-color:var(--sui-color-neutral-100)
}

.sui-button[data-appearance=tertiary]:disabled {
    background-color: var(--sui-color-neutral-100);
    color: var(--sui-color-secondary);
    background-color:var(--sui-color-transparent)
}

.sui-button[data-appearance=tertiary]:disabled.sui-has-border {
    --sui-button-border-width: 1px;
    --sui-border-color: var(--sui-color-tertiary)
}

.sui-button[data-appearance=negative] {
    background-color: var(--sui-color-neutral-100);
    color:var(--sui-color-stop-100)
}

.sui-button[data-appearance=negative]:focus-visible {
    outline:none
}

.sui-button[data-appearance=negative]:focus-visible.sui-has-border {
    --sui-button-border-width: 2px;
    --sui-border-color: var(--sui-color-accent-100)
}

.sui-button[data-appearance=negative][data-sui-long-press-button=true] {
    background: linear-gradient(to right, var(--sui-color-neutral-100) 0%, var(--sui-color-neutral-100) 100%);
    background-size: 200% 100%;
    background-position: 100% 0;
    will-change: background-position;
    -webkit-user-select: none;
    user-select: none;
    -webkit-touch-callout:none
}

.sui-button[data-appearance=negative][data-sui-long-press-button=true][data-sui-long-press-finished=true] {
    background:linear-gradient(to right, var(--sui-color-neutral-120) 0%, var(--sui-color-neutral-120) 100%)
}

@media (hover: hover) {
    .sui-button[data-appearance=negative][data-sui-long-press-button=true][data-sui-long-press-finished=false]:hover {
        background: linear-gradient(to right, var(--sui-color-neutral-120) 0%, var(--sui-color-neutral-120) 50%, var(--sui-color-neutral-100) 50%, var(--sui-color-neutral-100) 100%);
        background-size: 200% 100%;
        background-position: 100% 0;
        transition:var(--sui-long-press-duration, .3s) ease-in-out
    }
}

.sui-button[data-appearance=negative][data-sui-long-press-button=true][data-sui-long-press-finished=false]:active {
    background: linear-gradient(to right, var(--sui-color-neutral-120) 0%, var(--sui-color-neutral-120) 50%, var(--sui-color-neutral-100) 50%, var(--sui-color-neutral-100) 100%);
    background-size: 200% 100%;
    background-position: 0 0;
    transition:var(--sui-long-press-duration, .3s) ease-in-out
}

@media (hover: hover) {
    .sui-button[data-appearance=negative]:hover {
        background-color:var(--sui-color-neutral-100)
    }
}

.sui-button[data-appearance=negative]:active {
    background-color:var(--sui-color-neutral-120)
}

.sui-button[data-appearance=negative]:disabled {
    background-color: var(--sui-color-neutral-100);
    color:var(--sui-color-secondary)
}

.sui-button[data-appearance=negative]:disabled.sui-has-border {
    --sui-button-border-width: 1px;
    --sui-border-color: var(--sui-color-tertiary)
}

.sui-button[data-appearance=white] {
    background-color: var(--sui-color-white);
    color:var(--sui-color-primary)
}

.sui-button[data-appearance=white]:focus-visible {
    outline:none
}

.sui-button[data-appearance=white]:focus-visible.sui-has-border {
    --sui-button-border-width: 2px;
    --sui-border-color: var(--sui-color-accent-100)
}

.sui-button[data-appearance=white][data-sui-long-press-button=true] {
    background: linear-gradient(to right, var(--sui-color-white) 0%, var(--sui-color-white) 100%);
    background-size: 200% 100%;
    background-position: 100% 0;
    will-change: background-position;
    -webkit-user-select: none;
    user-select: none;
    -webkit-touch-callout:none
}

.sui-button[data-appearance=white][data-sui-long-press-button=true][data-sui-long-press-finished=true] {
    background:linear-gradient(to right, var(--sui-color-neutral-100) 0%, var(--sui-color-neutral-100) 100%)
}

@media (hover: hover) {
    .sui-button[data-appearance=white][data-sui-long-press-button=true][data-sui-long-press-finished=false]:hover {
        background: linear-gradient(to right, var(--sui-color-neutral-100) 0%, var(--sui-color-neutral-100) 50%, var(--sui-color-neutral-80) 50%, var(--sui-color-neutral-80) 100%);
        background-size: 200% 100%;
        background-position: 100% 0;
        transition:var(--sui-long-press-duration, .3s) ease-in-out
    }
}

.sui-button[data-appearance=white][data-sui-long-press-button=true][data-sui-long-press-finished=false]:active {
    background: linear-gradient(to right, var(--sui-color-neutral-100) 0%, var(--sui-color-neutral-100) 50%, var(--sui-color-neutral-80) 50%, var(--sui-color-neutral-80) 100%);
    background-size: 200% 100%;
    background-position: 0 0;
    transition:var(--sui-long-press-duration, .3s) ease-in-out
}

@media (hover: hover) {
    .sui-button[data-appearance=white]:hover {
        background-color:var(--sui-color-neutral-80)
    }
}

.sui-button[data-appearance=white]:active {
    background-color:var(--sui-color-neutral-100)
}

.sui-button[data-appearance=white]:disabled {
    background-color: var(--sui-color-neutral-100);
    color:var(--sui-color-secondary)
}

.sui-button[data-appearance=white]:disabled.sui-has-border {
    --sui-button-border-width: 1px;
    --sui-border-color: var(--sui-color-tertiary)
}

.sui-button[data-appearance=green] {
    background-color: var(--sui-color-success-100);
    color:var(--sui-color-white)
}

.sui-button[data-appearance=green]:focus-visible {
    outline:none
}

.sui-button[data-appearance=green]:focus-visible.sui-has-border {
    --sui-button-border-width: 2px;
    --sui-border-color: var(--sui-color-accent-100)
}

.sui-button[data-appearance=green][data-sui-long-press-button=true] {
    background: linear-gradient(to right, var(--sui-color-success-100) 0%, var(--sui-color-success-100) 100%);
    background-size: 200% 100%;
    background-position: 100% 0;
    will-change: background-position;
    -webkit-user-select: none;
    user-select: none;
    -webkit-touch-callout:none
}

.sui-button[data-appearance=green][data-sui-long-press-button=true][data-sui-long-press-finished=true] {
    background:linear-gradient(to right, var(--sui-color-success-120) 0%, var(--sui-color-success-120) 100%)
}

@media (hover: hover) {
    .sui-button[data-appearance=green][data-sui-long-press-button=true][data-sui-long-press-finished=false]:hover {
        background: linear-gradient(to right, var(--sui-color-success-120) 0%, var(--sui-color-success-120) 50%, var(--sui-color-success-80) 50%, var(--sui-color-success-80) 100%);
        background-size: 200% 100%;
        background-position: 100% 0;
        transition:var(--sui-long-press-duration, .3s) ease-in-out
    }
}

.sui-button[data-appearance=green][data-sui-long-press-button=true][data-sui-long-press-finished=false]:active {
    background: linear-gradient(to right, var(--sui-color-success-120) 0%, var(--sui-color-success-120) 50%, var(--sui-color-success-80) 50%, var(--sui-color-success-80) 100%);
    background-size: 200% 100%;
    background-position: 0 0;
    transition:var(--sui-long-press-duration, .3s) ease-in-out
}

@media (hover: hover) {
    .sui-button[data-appearance=green]:hover {
        background-color:var(--sui-color-success-80)
    }
}

.sui-button[data-appearance=green]:active {
    background-color:var(--sui-color-success-120)
}

.sui-button[data-appearance=green]:disabled {
    background-color: var(--sui-color-neutral-100);
    color:var(--sui-color-secondary)
}

.sui-button[data-appearance=green]:disabled.sui-has-border {
    --sui-button-border-width: 1px;
    --sui-border-color: var(--sui-color-tertiary)
}

.sui-button[data-size=l] {
    font-size: 1.0625rem;
    line-height: 1.25rem;
    font-weight:600
}

.font-rothorn.sui-button[data-size=l], .font-rothorn .sui-button[data-size=l] {
    font-size: 1.0625rem;
    line-height: 1.25rem;
    font-weight:599
}

.sui-button[data-size=l] {
    height: 3.5rem;
    border-radius: 1rem;
    padding:1rem
}

.sui-button[data-size=l] .sui-button-icon {
    width: 1.5rem;
    height:1.5rem
}

.sui-button[data-size=l].sui-button-has-content .sui-button-content {
    padding:.125rem .5rem
}

.sui-button[data-size=m] {
    font-size: .9375rem;
    line-height: 1.125rem;
    font-weight: 600;
    height: 3rem;
    border-radius: .75rem;
    padding:.9375rem 1rem
}

.sui-button[data-size=m] .sui-button-icon {
    width: 1rem;
    height:1rem
}

.sui-button[data-size=m].sui-button-has-content .sui-button-content {
    padding:0 .5rem
}

.sui-button[data-size=s] {
    font-size: .9375rem;
    line-height: 1.125rem;
    font-weight: 600;
    height: 2.5rem;
    border-radius: .5rem;
    padding:.6875rem .75rem
}

.sui-button[data-size=s] .sui-button-icon {
    width: 1rem;
    height:1rem
}

.sui-button[data-size=s].sui-button-has-content .sui-button-content {
    padding:0 .25rem
}

.sui-button[data-rounded=true] {
    border-radius: 9999px;
    padding:0
}

.sui-button[data-rounded=true][data-size=l] {
    min-width:3.5rem
}

.sui-button[data-rounded=true][data-size=m] {
    min-width:3rem
}

.sui-button[data-rounded=true][data-size=s] {
    min-width:2.5rem
}

.sui-form-field {
    position: relative;
    display: inline-flex;
    width: 100%;
    height: var(--sui-field-height);
    border-radius: var(--sui-field-round);
    padding: 0 var(--sui-field-space-x);
    cursor: text;
    align-items: center;
    overflow: hidden;
    text-align: left;
    background-color: var(--sui-color-neutral-100);
    transition:background-color .15s cubic-bezier(.4, 0, .2, 1)
}

.sui-form-field[data-content-type=textarea] {
    min-height: var(--sui-field-height);
    height:auto
}

.sui-form-field:not(.sui-disabled):hover, .sui-form-field:not(.sui-disabled).sui-focused {
    background-color:var(--sui-color-neutral-80)
}

.sui-form-field.sui-disabled {
    pointer-events:none
}

.sui-form-field.sui-has-suffix {
    padding-right:var(--sui-field-right-space-when-suffix)
}

.sui-form-field.sui-has-border.sui-focused:not(.sui-invalid):after {
    border-color:var(--sui-color-tertiary)
}

.sui-form-field.sui-has-border.sui-invalid:after {
    border-width: 2px;
    border-color:var(--sui-color-stop-100)
}

.sui-form-field[data-size=l] {
    font-size: 1.0625rem;
    line-height: 1.25rem;
    font-weight:400
}

.font-rothorn.sui-form-field[data-size=l], .font-rothorn .sui-form-field[data-size=l] {
    font-size: 1.0625rem;
    line-height: 1.5rem;
    font-weight:420
}

.sui-form-field[data-size=l] {
    --sui-field-height: 3.5rem;
    --sui-field-round: 1rem;
    --sui-field-space-x: 1.25rem;
    --sui-field-space-y: 1.125rem;
    --sui-field-right-space-when-suffix: .5rem;
    --sui-field-top-space-when-label: 1.625rem;
    --sui-field-bot-space-when-label: .5rem;
    --sui-field-suffix-left-space: .5rem;
    --sui-field-suffix-bottom-space: .0625rem
}

.sui-form-field[data-size=m] {
    font-size: .9375rem;
    line-height: 1.125rem;
    font-weight:400
}

.font-rothorn.sui-form-field[data-size=m], .font-rothorn .sui-form-field[data-size=m] {
    font-size: 1rem;
    line-height: 1.5rem;
    font-weight:420
}

.sui-form-field[data-size=m] {
    --sui-field-height: 3rem;
    --sui-field-round: .75rem;
    --sui-field-space-x: 1rem;
    --sui-field-space-y: .9375rem;
    --sui-field-right-space-when-suffix: .25rem;
    --sui-field-top-space-when-label: 1.4375rem;
    --sui-field-bot-space-when-label: .375rem;
    --sui-field-suffix-left-space: .5rem;
    --sui-field-suffix-bottom-space: 0px
}

.sui-form-field[data-size=s] {
    font-size: .8125rem;
    line-height: 1rem;
    font-weight:400
}

.font-rothorn.sui-form-field[data-size=s], .font-rothorn .sui-form-field[data-size=s] {
    font-size: .875rem;
    line-height: 1.5rem;
    font-weight:420
}

.sui-form-field[data-size=s] {
    --sui-field-height: 2.5rem;
    --sui-field-round: .5rem;
    --sui-field-space-x: .75rem;
    --sui-field-space-y: .75rem;
    --sui-field-right-space-when-suffix: .25rem;
    --sui-field-top-space-when-label: 1.1875rem;
    --sui-field-bot-space-when-label: .3125rem;
    --sui-field-suffix-left-space: .5rem;
    --sui-field-suffix-bottom-space: 0px
}

.sui-form-field:after {
    position: absolute;
    inset: 0;
    content: "";
    border-radius: inherit;
    border: 1px solid var(--sui-color-transparent);
    color: transparent;
    will-change: border-color;
    pointer-events: none;
    transition:border-color .15s cubic-bezier(.4, 0, .2, 1)
}

.sui-form-field .sui-input-wrapper {
    display: inline-flex;
    align-items: center;
    width: 100%;
}

.sui-form-field.sui-has-label[data-label-position=none] .sui-infix, .sui-form-field:not(.sui-has-label) .sui-infix, .sui-form-field.sui-has-label[data-label-position=none] .sui-prefix, .sui-form-field:not(.sui-has-label) .sui-prefix {
    padding:var(--sui-field-space-y) 0
}

.sui-prefix {
    position: absolute;
    left: var(--sui-field-space-x);
    top: 0;
    display: flex;
    height: 100%;
    align-items: baseline;
    justify-content:center
}

.sui-form-field.sui-has-prefix .sui-prefix {
    padding-right:.125rem
}

.sui-infix {
    position: relative;
    flex: auto;
    height:100%
}

.sui-suffixes {
    display: flex;
    align-items: center;
    padding-bottom:var(--sui-field-suffix-bottom-space)
}

.sui-form-field.sui-has-suffix .sui-suffixes {
    padding-left:var(--sui-field-suffix-left-space)
}

.sui-label {
    position: absolute;
    display: block;
    left: 0;
    top: calc(var(--sui-field-height) / 2);
    width: 100%;
    pointer-events: none;
    transform: translateY(-50%);
    overflow: hidden;
    text-overflow: ellipsis;
    text-wrap: nowrap;
    color: var(--sui-color-secondary);
    will-change: auto;
    transition-property: font-size, line-height, transform;
    transition-duration: .15s;
    transition-timing-function:cubic-bezier(.4, 0, .2, 1)
}

.sui-form-field[data-size=l][data-label-position=top] .sui-label {
    --tw-translate-y: -1.1875rem;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    font-size: .8125rem;
    line-height: 1rem;
    font-weight:400
}

.font-rothorn.sui-form-field[data-size=l][data-label-position=top] .sui-label, .font-rothorn .sui-form-field[data-size=l][data-label-position=top] .sui-label {
    font-size: .875rem;
    line-height: 1.5rem;
    font-weight:420
}

.sui-form-field[data-size=m][data-label-position=top] .sui-label {
    --tw-translate-y: -1.125rem;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    font-size: .8125rem;
    line-height: 1rem;
    font-weight:400
}

.font-rothorn.sui-form-field[data-size=m][data-label-position=top] .sui-label, .font-rothorn .sui-form-field[data-size=m][data-label-position=top] .sui-label {
    font-size: .875rem;
    line-height: 1.5rem;
    font-weight:420
}

.sui-form-field[data-size=s][data-label-position=top] .sui-label {
    --tw-translate-y: -.9375rem;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    font-size: .6875rem;
    line-height: .875rem;
    font-weight:600
}

.sui-form-field[data-label-position=none] .sui-label {
    display:none
}

.sui-input {
    display: block;
    height: auto;
    width: 100%;
    border-radius: 0;
    background: none;
    appearance: none;
    color: var(--sui-color-primary);
    padding: 0;
    font: inherit;
    letter-spacing: inherit;
    text-decoration: inherit;
    text-transform:inherit
}

.sui-input:focus, .sui-input:hover {
    outline:0
}

.sui-input::placeholder {
    color:var(--sui-input-placeholder-color, var(--sui-color-secondary))
}

.sui-input:-webkit-autofill, .sui-input:-webkit-autofill:hover, .sui-input:-webkit-autofill:focus, .sui-input:-webkit-autofill:active, .sui-input:-webkit-autofill:first-line {
    border: 0;
    -webkit-text-fill-color: inherit;
    -webkit-box-shadow: none;
    -webkit-transition: background-color 5000s ease-in-out 0s;
    transition:background-color 5000s ease-in-out 0s
}

.sui-input:disabled {
    pointer-events: none;
    color:var(--sui-color-secondary)
}

.sui-input:disabled::placeholder {
    -webkit-user-select: none;
    user-select:none
}

.sui-has-label .sui-input::placeholder {
    color:transparent
}

.sui-has-label .sui-input:focus::placeholder {
    color:var(--sui-color-tertiary)
}

.sui-suffix {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--sui-color-tertiary);
    outline-color: var(--sui-color-accent-100);
    width: 2.5rem;
    height:2.5rem
}

.sui-form-field[data-size=s] .sui-suffix {
    width: 2rem;
    height:2rem
}

textarea.sui-input {
    resize:none
}

textarea.sui-textarea-autosize-measuring {
    padding: 2px 0 !important;
    box-sizing: content-box !important;
    height: auto !important;
    overflow:hidden !important
}

.sui-form-field[data-appearance=bold] {
    font-size: 1.0625rem;
    line-height: 1.25rem;
    letter-spacing: .0625rem;
    font-weight:700
}

.sui-form-field[data-appearance=emphasized]:not(.sui-has-label) {
    --sui-input-placeholder-color: var(--sui-color-secondary)
}

.sui-form-field[data-appearance=emphasized]:not(.sui-has-label)[data-size=l] {
    --sui-field-space-y: 1rem;
    font-size: 1.25rem;
    line-height: 1.5rem;
    font-weight:650
}

.font-rothorn.sui-form-field[data-appearance=emphasized]:not(.sui-has-label)[data-size=l], .font-rothorn .sui-form-field[data-appearance=emphasized]:not(.sui-has-label)[data-size=l] {
    font-size: 1.25rem;
    line-height: 1.5rem;
    font-weight:599
}

.sui-form-field[data-appearance=emphasized]:not(.sui-has-label)[data-size=m] {
    --sui-field-space-y: .875rem;
    font-size: 1.0625rem;
    line-height: 1.25rem;
    font-weight:600
}

.font-rothorn.sui-form-field[data-appearance=emphasized]:not(.sui-has-label)[data-size=m], .font-rothorn .sui-form-field[data-appearance=emphasized]:not(.sui-has-label)[data-size=m] {
    font-size: 1.0625rem;
    line-height: 1.25rem;
    font-weight:599
}

.sui-form-field[data-appearance=emphasized]:not(.sui-has-label)[data-size=s] {
    --sui-field-space-y: .625rem;
    font-size: 1.0625rem;
    line-height: 1.25rem;
    font-weight:600
}

.font-rothorn.sui-form-field[data-appearance=emphasized]:not(.sui-has-label)[data-size=s], .font-rothorn .sui-form-field[data-appearance=emphasized]:not(.sui-has-label)[data-size=s] {
    font-size: 1.0625rem;
    line-height: 1.25rem;
    font-weight:599
}

.sui-form-field-dropdown {
    display: flex;
    flex-direction: column;
    overflow: auto;
    width: 100%;
    max-height: 17.5rem;
    box-shadow: 0 4px 16px #202f4e26;
    background-color:var(--sui-color-white)
}

.sui-form-field-dropdown[data-size=s] {
    border-radius:.5rem
}

.sui-form-field-dropdown[data-size=m] {
    border-radius:.75rem
}

.sui-form-field-dropdown[data-size=l] {
    border-radius:1rem
}

.sui-form-field[data-size=l] + .sui-form-field-message {
    --sui-field-message-space-y: .75rem;
    --sui-field-message-space-x: 1.25rem
}

.sui-form-field[data-size=m] + .sui-form-field-message {
    --sui-field-message-space-y: .5rem;
    --sui-field-message-space-x: 1rem
}

.sui-form-field[data-size=s] + .sui-form-field-message {
    font-size: .8125rem;
    line-height: 1rem;
    font-weight:400
}

.font-rothorn.sui-form-field[data-size=s] + .sui-form-field-message, .font-rothorn .sui-form-field[data-size=s] + .sui-form-field-message {
    font-size: .875rem;
    line-height: 1.5rem;
    font-weight:420
}

.sui-form-field[data-size=s] + .sui-form-field-message {
    --sui-field-message-space-y: .25rem;
    --sui-field-message-space-x: .75rem
}

.sui-form-field-message {
    font-family: Inter, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", Segoe UI Symbol, "Noto Color Emoji";
    font-size: .9375rem;
    line-height: 1.125rem;
    font-weight:400
}

.font-rothorn.sui-form-field-message, .font-rothorn .sui-form-field-message {
    font-size: 1rem;
    line-height: 1.5rem;
    font-weight:420
}

.sui-form-field-message {
    width: 100%;
    display: block;
    padding:var(--sui-field-message-space-y) var(--sui-field-message-space-x)
}

.sui-menu {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-height: 17.5rem;
    overflow-x: auto;
    box-shadow: 0 6px 34px #202f4e1f;
    border-radius: 1rem;
    background-color: var(--sui-color-white);
    padding:.25rem
}

.sui-menu-item {
    display: flex;
    align-items: center;
    padding: 0 1.25rem;
    width:100%
}

.sui-menu-item:focus-visible {
    outline-color:var(--sui-color-primary)
}

.sui-menu[data-size=l] .sui-menu-item {
    font-size: 1.0625rem;
    line-height: 1.25rem;
    font-weight:400
}

.font-rothorn.sui-menu[data-size=l] .sui-menu-item, .font-rothorn .sui-menu[data-size=l] .sui-menu-item {
    font-size: 1.0625rem;
    line-height: 1.5rem;
    font-weight:420
}

.sui-menu[data-size=l] .sui-menu-item {
    padding: .375rem 1.25rem;
    min-height: 3.5rem;
    border-radius:.75rem
}

.sui-menu[data-size=m] .sui-menu-item {
    font-size: .9375rem;
    line-height: 1.125rem;
    font-weight:400
}

.font-rothorn.sui-menu[data-size=m] .sui-menu-item, .font-rothorn .sui-menu[data-size=m] .sui-menu-item {
    font-size: 1rem;
    line-height: 1.5rem;
    font-weight:420
}

.sui-menu[data-size=m] .sui-menu-item {
    padding: .5rem 1rem;
    min-height: 3rem;
    border-radius:.5rem
}

.sui-menu[data-size=s] .sui-menu-item {
    font-size: .9375rem;
    line-height: 1.125rem;
    font-weight:400
}

.font-rothorn.sui-menu[data-size=s] .sui-menu-item, .font-rothorn .sui-menu[data-size=s] .sui-menu-item {
    font-size: 1rem;
    line-height: 1.5rem;
    font-weight:420
}

.sui-menu[data-size=s] .sui-menu-item {
    padding: .25rem .75rem;
    min-height: 2.5rem;
    border-radius:.25rem
}

.sui-mobile-menu .sui-menu-item {
    font-size: 1.0625rem;
    line-height: 1.25rem;
    font-weight:400
}

.font-rothorn.sui-mobile-menu .sui-menu-item, .font-rothorn .sui-mobile-menu .sui-menu-item {
    font-size: 1.0625rem;
    line-height: 1.5rem;
    font-weight:420
}

.sui-mobile-menu .sui-menu-item {
    min-height:3.5rem
}

.sui-menu-item:hover {
    background-color:var(--sui-color-neutral-100)
}

.sui-menu-item:active {
    background-color:var(--sui-color-neutral-120)
}

.sui-link {
    display: inline-block;
    color: var(--sui-color-secondary);
    text-decoration: underline;
    transition-duration: .15s;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function:cubic-bezier(.4, 0, .2, 1)
}

.sui-link:hover, .sui-link-hovered {
    color:var(--sui-color-accent-100)
}

.sui-link:active {
    color:var(--sui-color-accent-120)
}

.sui-scrollbar--windows-chrome::-webkit-scrollbar {
    width:.75rem
}

.sui-scrollbar--windows-chrome::-webkit-scrollbar-thumb {
    border: .25rem solid transparent;
    background-clip: padding-box;
    background-color: var(--sui-color-tertiary);
    border-radius:.75rem
}

.sui-scrollbar--windows-chrome::-webkit-scrollbar-button {
    display: none;
    width: 0;
    height:0
}

.sui-scrollbar--windows-chrome::-webkit-scrollbar-corner {
    background-color:transparent
}

.sui-hidden-scrollbar::-webkit-scrollbar {
    display:none
}

.sui-hidden-scrollbar::-webkit-scrollbar-thumb {
    display:none
}

.sui-shimmer {
    background-color: var(--sui-color-neutral-bg);
    will-change: background-position;
    animation: skeleton 1.8s ease-in-out infinite;
    background-image: linear-gradient(105deg, transparent 0%, transparent 40%, var(--sui-color-neutral-120) 50%, transparent 60%, transparent 100%);
    background-size: 200% auto;
    background-repeat: no-repeat;
    background-position-x:-50%
}

@keyframes skeleton {
    0% {
        background-position:150%
    }

    to {
        background-position:-50%
    }
}

.sui-radio-button {
    --border-color-default: var(--sui-color-secondary);
    --color-checked: var(--sui-color-accent-100);
    --color-hover: var(--sui-color-neutral-80);
    --color-disabled: var(--sui-color-neutral-120);
    border: 1px solid var(--border-color-default);
    border-radius: 50%;
    appearance: none;
    background-color: transparent;
    outline:none
}

.sui-radio-button:not(:disabled):active {
    background-color:var(--sui-color-neutral-120)
}

.sui-radio-button:not(:disabled):hover {
    cursor:pointer
}

.sui-radio-button:not(:disabled):hover:not(:checked):not(:active) {
    background-color:var(--color-hover)
}

.sui-radio-button:checked {
    border-width: 2px;
    background-clip:content-box
}

.sui-radio-button:checked:not(:disabled) {
    background-color:var(--color-checked)
}

.sui-radio-button:checked:not(:disabled):active {
    background-color:var(--sui-color-accent-120)
}

.sui-radio-button:disabled:not(:checked) {
    border-color: transparent;
    background-color:var(--color-disabled)
}

.sui-radio-button:disabled:checked {
    border-color: var(--color-disabled);
    background-image: radial-gradient(circle, var(--color-disabled) 0%, var(--color-disabled) 50%, transparent 50%, transparent 100%);
    background-clip:content-box
}

.sui-radio-button[data-appearance=error] {
    border:2px solid var(--sui-color-stop-100)
}

@media (hover: hover) {
    .sui-radio-button[data-appearance=error]:checked:not(:active):hover {
        background-color: var(--sui-color-accent-80)
    }
}

.sui-radio-button[data-appearance=""]:checked:not(:disabled) {
    border-color: var(--color-checked)
}

.sui-radio-button[data-appearance=""]:checked:not(:disabled):active {
    border-color: var(--sui-color-accent-120);
    background-color:var(--sui-color-accent-120)
}

@media (hover: hover) {
    .sui-radio-button[data-appearance=""]:checked:not(:active):hover {
        border-color: var(--sui-color-accent-80);
        background-color:var(--sui-color-accent-80)
    }
}

.sui-radio-button[data-size=l] {
    height: 1.375rem;
    width: 1.375rem;
    padding:.1875rem
}

.sui-radio-button[data-size=m] {
    height: 1.25rem;
    width: 1.25rem;
    padding:.171875rem
}

.sui-radio-button[data-size=s] {
    height: 1.125rem;
    width: 1.125rem;
    padding:.15625rem
}

.sui-checkbox {
    --sui-checkbox-mark-14: url("data:image/svg+xml,%3Csvg width='14' height='10' viewBox='0 0 14 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 5L5 9L13 1' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    --sui-checkbox-mark-12: url("data:image/svg+xml,%3Csvg width='12' height='9' viewBox='0 0 12 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 5L4.5 8L11 1' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    --sui-checkbox-mark-10: url("data:image/svg+xml,%3Csvg width='10' height='8' viewBox='0 0 10 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 4L4 7L9 1.5' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
    --sui-checkbox-ideterminate-s: url("data:image/svg+xml,%3Csvg width='8' height='2' viewBox='0 0 8 2' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1H7' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E%0A");
    --sui-checkbox-indeterminate-m: url("data:image/svg+xml,%3Csvg width='10' height='2' viewBox='0 0 10 2' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1H9' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E%0A");
    --sui-checkbox-indeterminate-l: url("data:image/svg+xml,%3Csvg width='12' height='2' viewBox='0 0 12 2' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1H11' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E%0A");
    appearance: none;
    background-color: transparent;
    margin: 0;
    position: relative;
    border: .0625rem solid var(--sui-color-secondary);
    cursor: pointer;
    overflow:hidden
}

@media (hover: hover) {
    .sui-checkbox:hover {
        background-color:var(--sui-color-neutral-80)
    }
}

.sui-checkbox:active {
    background-color:var(--sui-color-neutral-120)
}

.sui-checkbox:disabled {
    border: none;
    cursor: default;
    background-color:var(--sui-color-neutral-120)
}

.sui-checkbox:disabled:before {
    background-color:var(--sui-color-secondary)
}

.sui-checkbox:checked, .sui-checkbox:indeterminate {
    background-color: var(--sui-color-accent-100);
    border:none
}

@media (hover: hover) {
    .sui-checkbox:checked:hover, .sui-checkbox:indeterminate:hover {
        border-color: var(--sui-color-accent-80);
        background-color:var(--sui-color-accent-80)
    }
}

.sui-checkbox:checked:active, .sui-checkbox:indeterminate:active {
    background-color: var(--sui-color-accent-120);
    border-color:var(--sui-color-accent-120)
}

.sui-checkbox:checked:disabled, .sui-checkbox:indeterminate:disabled {
    background-color: var(--sui-color-neutral-120);
    border-color:transparent
}

.sui-checkbox:before {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    content: "";
    background: #fff;
    mask: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg"></svg>') no-repeat center
}

.sui-checkbox[data-size=l] {
    min-width: 1.25rem;
    min-height: 1.25rem;
    width: 1.25rem;
    height: 1.25rem;
    border-radius:.375rem
}

.sui-checkbox[data-size=l]:checked:before {
    mask-image:var(--sui-checkbox-mark-14)
}

.sui-checkbox[data-size=l]:indeterminate:before {
    mask-image:var(--sui-checkbox-indeterminate-l)
}

.sui-checkbox[data-size=m] {
    min-width: 1.125rem;
    min-height: 1.125rem;
    width: 1.125rem;
    height: 1.125rem;
    border-radius:.3125rem
}

.sui-checkbox[data-size=m]:checked:before {
    mask-image:var(--sui-checkbox-mark-12)
}

.sui-checkbox[data-size=m]:indeterminate:before {
    mask-image:var(--sui-checkbox-indeterminate-m)
}

.sui-checkbox[data-size=s] {
    min-width: 1rem;
    min-height: 1rem;
    width: 1rem;
    height: 1rem;
    border-radius:.25rem
}

.sui-checkbox[data-size=s]:checked:before {
    mask-image:var(--sui-checkbox-mark-10)
}

.sui-checkbox[data-size=s]:indeterminate:before {
    mask-image:var(--sui-checkbox-ideterminate-s)
}

.sui-checkbox[data-appearance=error]:not(:disabled) {
    border: none;
    outline:2px solid var(--sui-color-stop-100)
}

.sui-checkbox[data-appearance=error]:not(:disabled)[data-size=l] {
    min-width: 1rem;
    min-height: 1rem;
    width: 1rem;
    height: 1rem;
    border-radius: .25rem;
    outline-offset:.125rem
}

.sui-checkbox[data-appearance=error]:not(:disabled)[data-size=m] {
    min-height: .875rem;
    min-width: .875rem;
    width: .875rem;
    height: .875rem;
    border-radius: .15625rem;
    outline-offset:.125rem
}

.sui-checkbox[data-appearance=error]:not(:disabled)[data-size=s] {
    min-height: .8125rem;
    min-width: .8125rem;
    width: .8125rem;
    height: .8125rem;
    border-radius: .15625rem;
    outline-offset:.125rem
}

@keyframes sui-checkmark-appear {
    0% {
        transform:scale(0)
    }

    to {
        transform:scale(1)
    }
}

.sui-checkbox.sui-animated-mark:checked:before {
    animation:sui-checkmark-appear .3s ease-in-out
}

.sui-progress-bar {
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius:.5rem
}

.sui-progress-bar::-webkit-progress-bar {
    background-color:var(--sui-color-neutral-bg)
}

.sui-progress-bar::-webkit-progress-value {
    border-radius: .5rem;
    background: linear-gradient(270deg, #8019a6, #2101e6);
    -webkit-transition: width var(--sui-progress-animation-duration, .15s) linear;
    transition:width var(--sui-progress-animation-duration, .15s) linear
}

.sui-native-slider {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    cursor: pointer;
    appearance: none;
    height: var(--slider-track-height);
    background-color: transparent;
    background-clip: content-box;
    outline: none;
    border-radius: var(--track-border-radius);
    padding:0 var(--slider-thumb-around-space)
}

.sui-native-slider:active {
    cursor:ew-resize
}

.sui-native-slider:disabled {
    opacity: .56;
    cursor:auto
}

.sui-native-slider::-webkit-slider-container {
    border-radius:inherit
}

.sui-native-slider::-webkit-slider-runnable-track {
    height: var(--slider-track-height);
    border-radius: inherit;
    background-color:transparent
}

.sui-native-slider::-moz-range-track {
    height: var(--slider-track-height);
    border-radius: inherit;
    background-color:transparent
}

.sui-native-slider::-webkit-slider-thumb {
    appearance: none;
    color: transparent;
    border: none;
    border-radius: 50%;
    background: transparent var(--slider-thumb-icon) no-repeat center;
    height: var(--slider-thumb-size);
    width: var(--slider-thumb-size);
    box-shadow: 0 6px 34px #202f4e1f;
    cursor: grab;
    margin-top:calc(var(--slider-track-height) / 2 - var(--slider-thumb-size) / 2)
}

.sui-native-slider::-webkit-slider-thumb:active {
    cursor:grabbing
}

.sui-native-slider::-webkit-slider-thumb:disabled {
    cursor:pointer
}

.sui-native-slider::-webkit-slider-thumb:focus-visible {
    box-shadow:0 6px 34px #202f4e1f
}

.sui-native-slider::-moz-range-thumb {
    appearance: none;
    color: transparent;
    border: none;
    border-radius: 50%;
    background: transparent var(--slider-thumb-icon) no-repeat center;
    height: var(--slider-thumb-size);
    width: var(--slider-thumb-size);
    box-shadow: 0 6px 34px #202f4e1f;
    cursor:grab
}

.sui-native-slider::-moz-range-thumb:active {
    cursor:grabbing
}

.sui-native-slider::-moz-range-thumb:disabled {
    cursor:pointer
}

.sui-native-slider::-moz-range-thumb:focus-visible {
    box-shadow:0 6px 34px #202f4e1f
}

.sui-native-slider::-moz-range-progress {
    background: transparent;
    border-radius: inherit;
    border-top-right-radius: 0;
    border-bottom-right-radius:0
}

.sui-link-button {
    display: inline-flex;
    align-items: center;
    color: var(--sui-color-accent-100);
    font-size: .9375rem;
    line-height: 1.125rem;
    font-weight:600
}

@media (hover: hover) {
    .sui-link-button:hover {
        color:var(--sui-color-accent-80)
    }
}

.sui-link-button:active {
    color:var(--sui-color-accent-120)
}

.sui-link-button.sui-loading {
    pointer-events:none
}

.sui-link-icon {
    width: 1rem;
    height:1rem
}

:host[data-icon-rotated=true] .sui-link-icon {
    transform:rotate(180deg)
}

.sui-link-icon.left {
    margin-right:.25rem
}

.sui-link-icon.right {
    margin-left:.25rem
}

.sui-list {
    display: flex;
    padding: .25rem;
    flex-direction: column;
    width: 100%;
    border-radius:1rem
}

.sui-list .sui-list-item {
    margin-bottom:.25rem
}

.sui-list .sui-list-item:last-child {
    margin-bottom:0
}

.sui-list-item {
    display: flex;
    align-items: center;
    width:100%
}

.sui-list-item:not(:disabled) {
    cursor:pointer
}

.sui-list-item[data-size=l] {
    font-size: 1.0625rem;
    line-height: 1.25rem;
    font-weight:400
}

.font-rothorn.sui-list-item[data-size=l], .font-rothorn .sui-list-item[data-size=l] {
    font-size: 1.0625rem;
    line-height: 1.5rem;
    font-weight:420
}

.sui-list-item[data-size=l] {
    padding: .375rem 1.25rem;
    min-height: 3.5rem;
    border-radius:.75rem
}

.sui-list-item[data-size=m] {
    font-size: .9375rem;
    line-height: 1.125rem;
    font-weight:400
}

.font-rothorn.sui-list-item[data-size=m], .font-rothorn .sui-list-item[data-size=m] {
    font-size: 1rem;
    line-height: 1.5rem;
    font-weight:420
}

.sui-list-item[data-size=m] {
    padding: .5rem 1rem;
    min-height: 3rem;
    border-radius:.5rem
}

.sui-list-item[data-size=s] {
    font-size: .9375rem;
    line-height: 1.125rem;
    font-weight:400
}

.font-rothorn.sui-list-item[data-size=s], .font-rothorn .sui-list-item[data-size=s] {
    font-size: 1rem;
    line-height: 1.5rem;
    font-weight:420
}

.sui-list-item[data-size=s] {
    padding: .25rem .75rem;
    min-height: 2.5rem;
    border-radius:.25rem
}

.sui-list-item[data-size=s][data-caption=true] {
    font-size: .6875rem;
    line-height: .875rem;
    font-weight:600
}

.sui-list-item__content-left {
    display: flex;
    align-self: center;
    overflow: hidden;
    align-items: center;
    justify-content:center
}

[data-size=l] .sui-list-item__content-left {
    min-width: 2.5rem;
    max-width: 2.5rem;
    min-height: 2.5rem;
    max-height: 2.5rem;
    margin-right:1.25rem
}

[data-size=m] .sui-list-item__content-left {
    min-width: 1.5rem;
    max-width: 1.5rem;
    min-height: 1.5rem;
    max-height: 1.5rem;
    margin-right:1rem
}

[data-size=s] .sui-list-item__content-left {
    min-width: 1.125rem;
    max-width: 1.125rem;
    min-height: 1.125rem;
    max-height: 1.125rem;
    margin-right:.75rem
}

.sui-list-item__content-right {
    display: flex;
    align-self: center;
    overflow: hidden;
    align-items: center;
    justify-content:center
}

[data-size=l] .sui-list-item__content-right {
    min-width: 2.5rem;
    max-width: 2.5rem;
    min-height: 2.5rem;
    max-height: 2.5rem;
    margin-left:1.25rem
}

[data-size=m] .sui-list-item__content-right {
    min-width: 1.5rem;
    max-width: 1.5rem;
    min-height: 1.5rem;
    max-height: 1.5rem;
    margin-left:1rem
}

[data-size=s] .sui-list-item__content-right {
    min-width: 1.125rem;
    max-width: 1.125rem;
    min-height: 1.125rem;
    max-height: 1.125rem;
    margin-left:.75rem
}

.sui-list-item__content-main {
    display: flex;
    flex-direction: column;
    gap: .25rem;
    align-items: flex-start;
    justify-content: center;
    width: 100%;
    border-radius: inherit;
    text-align:left
}

.sui-list-item__caption {
    font-size: .8125rem;
    line-height: 1rem;
    font-weight:400
}

.font-rothorn.sui-list-item__caption, .font-rothorn .sui-list-item__caption {
    font-size: .875rem;
    line-height: 1.5rem;
    font-weight:420
}

.sui-list-item__caption {
    text-align: left;
    color:var(--sui-color-secondary)
}

@media (hover: hover) {
    .sui-list-item[data-appearance=""][data-selectable=true]:hover {
        background-color: var(--sui-color-neutral-100)
    }
}

.sui-list-item[data-appearance=""][data-selectable=true]:active, .sui-list-item[data-appearance=""][data-active=true] {
    background-color:var(--sui-color-neutral-120)
}

@keyframes loaderRotate {
    to {
        transform:rotate(1turn)
    }
}

@keyframes loaderDashOffsetXS {
    0% {
        stroke-dasharray: 1, 42;
        stroke-dashoffset:0
    }

    50% {
        stroke-dasharray:25, 42
    }

    to {
        stroke-dasharray: 25, 42;
        stroke-dashoffset:-38
    }
}

@keyframes loaderDashOffsetS {
    0% {
        stroke-dasharray: 1, 64;
        stroke-dashoffset:0
    }

    50% {
        stroke-dasharray:38, 64
    }

    to {
        stroke-dasharray: 38, 64;
        stroke-dashoffset:-58
    }
}

@keyframes loaderDashOffsetM {
    0% {
        stroke-dasharray: 1, 107;
        stroke-dashoffset:0
    }

    50% {
        stroke-dasharray:64, 107
    }

    to {
        stroke-dasharray: 64, 107;
        stroke-dashoffset:-90
    }
}

@keyframes loaderDashOffsetL {
    0% {
        stroke-dasharray: 1, 150;
        stroke-dashoffset:0
    }

    50% {
        stroke-dasharray:90, 150
    }

    to {
        stroke-dasharray: 90, 150;
        stroke-dashoffset:-135
    }
}

.sui-loader {
    display: flex;
    align-items: center;
    justify-content: space-around;
    width:fit-content
}

.sui-loader .svg {
    color: inherit;
    animation: loaderRotate 1.5s ease-in-out infinite;
    width: 1.5rem;
    height:1.5rem
}

.sui-loader .svg[data-size=xs] {
    height: 16px;
    width:16px
}

.sui-loader .svg[data-size=xs] .path {
    animation:loaderDashOffsetXS 1.5s ease-in-out infinite
}

.sui-loader .svg[data-size=s] {
    height: 24px;
    width:24px
}

.sui-loader .svg[data-size=s] .path {
    animation:loaderDashOffsetS 1.5s ease-in-out infinite
}

.sui-loader .svg[data-size=m] {
    height: 40px;
    width:40px
}

.sui-loader .svg[data-size=m] .path {
    animation:loaderDashOffsetM 1.5s ease-in-out infinite
}

.sui-loader .svg[data-size=l] {
    height: 56px;
    width:56px
}

.sui-loader .svg[data-size=l] .path {
    animation:loaderDashOffsetL 1.5s ease-in-out infinite
}

.sui-loader .svg .path {
    stroke: currentColor;
    stroke-linecap:round
}

label.sui-toggle-block {
    position: relative;
    overflow: hidden;
    display:inline-block
}

label.sui-toggle-block input {
    appearance: none;
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    border-radius:inherit
}

label.sui-toggle-block input:not(:disabled) {
    cursor:pointer
}

label.sui-toggle-block input:checked {
    border: 2px solid var(--sui-color-accent-100)
}

.sui-tooltip[data-appearance=""], .sui-tooltip[data-appearance] {
    display: flex;
    flex-direction: column;
    overflow: auto;
    width: 100%;
    box-shadow: 0 6px 34px #202f4e1f;
    background-color: var(--sui-color-white)
}

.sui-tooltip[data-appearance=""][data-size=s], .sui-tooltip[data-appearance][data-size=s] {
    padding: 1rem 1.25rem;
    border-radius: .5rem
}

.sui-tooltip[data-appearance=""][data-size=m], .sui-tooltip[data-appearance][data-size=m] {
    padding: 1.25rem 1.5rem;
    border-radius: .75rem
}

.sui-tooltip[data-appearance=""][data-size=l], .sui-tooltip[data-appearance][data-size=l] {
    padding: 1.25rem 1.5rem;
    border-radius:1rem
}

.sui-table {
    position:relative
}

.sui-table td, .sui-table th {
    text-align: left;
    border-bottom:1px solid var(--sui-color-neutral-120)
}

.sui-table tbody tr:last-child td {
    border-bottom:0
}

.sui-table .sui-head-cell-sticky {
    position:sticky
}

.sui-table .sui-head-cell-sticky:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--sui-table-head-cell-sticky-background-color, var(--sui-color-white));
    z-index: -1;
    pointer-events:none
}

.sui-table .sui-table-interactive {
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    transition-duration: .15s;
    cursor:pointer
}

.sui-table .sui-table-interactive:hover, .sui-table .sui-table-interactive:hover .sui-checkbox {
    background-color:var(--sui-color-neutral-80)
}

.sui-table .sui-table-interactive:active {
    background-color:var(--sui-color-neutral-120)
}

.sui-table .sui-table-interactive:focus-visible {
    outline: none;
    background-color:var(--sui-color-neutral-80)
}

.sui-table .sui-cell-checkbox {
    font-weight: 400;
    width: 3rem;
    height: 1px;
    vertical-align: middle;
    padding:0
}

.sui-table[data-size=l] {
    font-size: 1.0625rem;
    line-height: 1.25rem;
    font-weight:400
}

.font-rothorn.sui-table[data-size=l], .font-rothorn .sui-table[data-size=l] {
    font-size: 1.0625rem;
    line-height: 1.5rem;
    font-weight:420
}

.sui-table[data-size=l] td:not(.sui-cell-checkbox), .sui-table[data-size=l] th:not(.sui-cell-checkbox) {
    font-weight: 400;
    padding:1.25rem
}

.sui-table[data-size=m] {
    font-size: .9375rem;
    line-height: 1.125rem;
    font-weight:400
}

.font-rothorn.sui-table[data-size=m], .font-rothorn .sui-table[data-size=m] {
    font-size: 1rem;
    line-height: 1.5rem;
    font-weight:420
}

.sui-table[data-size=m] td:not(.sui-cell-checkbox), .sui-table[data-size=m] th:not(.sui-cell-checkbox) {
    font-weight: 400;
    padding:1rem 1.25rem
}

.sui-table[data-size=s] {
    font-size: .8125rem;
    line-height: 1rem;
    font-weight:400
}

.font-rothorn.sui-table[data-size=s], .font-rothorn .sui-table[data-size=s] {
    font-size: .875rem;
    line-height: 1.5rem;
    font-weight:420
}

.sui-table[data-size=s] td:not(.sui-cell-checkbox), .sui-table[data-size=s] th:not(.sui-cell-checkbox) {
    font-weight: 400;
    padding:.75rem 1rem
}

.sui-th-dropdown {
    display: flex;
    flex-direction: column;
    overflow: auto;
    width: 100%;
    box-shadow: 0 6px 34px #202f4e1f;
    background-color: var(--sui-color-white);
    border-radius:.75rem
}

.sui-pagination {
    display:flex
}

.sui-pagination .sui-button.sui-pagination-active {
    background-color:var(--sui-color-neutral-120)
}

.sui-pagination .sui-pagination-ellipsis {
    display: flex;
    align-items: flex-end;
    justify-content:center
}

.sui-horizontal-scroll-view {
    display: flex;
    overflow-x: auto;
    gap: .75rem;
    padding:0 .75rem
}

.sui-horizontal-scroll-view_mobile {
    -ms-overflow-style: none;
    scrollbar-width:none
}

.sui-horizontal-scroll-view_mobile::-webkit-scrollbar {
    display:none
}

.sui-tabs {
    --sui-tabs-gap: 1.25rem;
    width: 100%;
    display: flex;
    gap: var(--sui-tabs-gap);
    padding-left:1.25rem
}

.sui-tabs[vertical] {
    width: fit-content;
    flex-direction: column;
    gap: 0;
    align-items:flex-start
}

.sui-tabs[data-size=l] {
    --sui-tabs-gap: 1.25rem
}

.sui-tabs[data-size=m] {
    --sui-tabs-gap: 1rem
}

.sui-tabs[data-size=s] {
    --sui-tabs-gap: .75rem
}

.sui-tabs[data-border-type=full] {
    border-bottom:1px solid var(--sui-color-tertiary)
}

.sui-tabs[data-border-type=tabs-only] > .sui-tab:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: calc(100% + var(--sui-tabs-gap));
    height: .0625rem;
    background-color:var(--sui-color-tertiary)
}

.sui-tabs[data-border-type=tabs-only] > .sui-tab:last-child:after {
    width:100%
}

.sui-tab {
    --sui-tab-horizontal-padding: 1rem;
    font-family: Inter, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", Segoe UI Symbol, "Noto Color Emoji";
    display: flex;
    align-items: center;
    height: 100%;
    position: relative;
    box-sizing: border-box;
    cursor:pointer
}

.sui-tab:focus-visible {
    outline: 2px solid #2401fe;
    outline-offset:-1px
}

.sui-tab[data-size=l] {
    font-size: 1.0625rem;
    line-height: 1.25rem;
    font-weight:600
}

.font-rothorn.sui-tab[data-size=l], .font-rothorn .sui-tab[data-size=l] {
    font-size: 1.0625rem;
    line-height: 1.25rem;
    font-weight:599
}

.sui-tab[data-size=l] {
    --sui-tab-horizontal-padding: 1rem;
    height:3rem
}

.sui-tab[data-size=m] {
    font-size: .9375rem;
    line-height: 1.125rem;
    font-weight: 600;
    --sui-tab-horizontal-padding: .75rem;
    height:2.5rem
}

.sui-tab[data-size=s] {
    font-size: .8125rem;
    line-height: 1rem;
    font-weight: 600;
    --sui-tab-horizontal-padding: .75rem;
    height:2rem
}

.sui-tab[data-sui-tab-orientation=horizontal] {
    padding:0
}

.sui-tab[data-sui-tab-orientation=vertical] {
    padding: 0 var(--sui-tab-horizontal-padding);
    width: 100%;
    text-align:left
}

.sui-tab[data-sui-tab-orientation=horizontal][data-sui-tab-active=true]:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: .1875rem;
    background-color: var(--sui-tab-active-custom-color, var(--sui-color-primary));
    z-index:2
}

@media (hover: hover) {
    .sui-tab[data-sui-tab-orientation=horizontal]:not([data-sui-tab-active]):hover:before {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: .1875rem;
        background-color: #c7cacf;
        z-index:2
    }
}

.sui-tab[data-sui-tab-orientation=vertical][data-sui-tab-active=true]:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: .1875rem;
    height: 100%;
    background-color:var(--sui-tab-active-custom-color, var(--sui-color-primary))
}

@media (hover: hover) {
    .sui-tab[data-sui-tab-orientation=vertical]:not([data-sui-tab-active]):hover:before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: .1875rem;
        height: 100%;
        background-color:var(--sui-color-tertiary)
    }
}

.sui-switch {
    --sui-switch-transtion-interval: .1s;
    position: relative;
    appearance: none;
    outline: none;
    cursor: pointer;
    background-color: var(--sui-color-white);
    border-radius: 1rem;
    border: 1px solid var(--sui-color-tertiary);
    transition:background-color var(--sui-switch-transtion-interval) ease
}

.sui-switch:before {
    content: "";
    position: absolute;
    top: .0625rem;
    left: .0625rem;
    border-radius: 50%;
    background-color: var(--sui-color-white);
    border: 1px solid var(--sui-color-tertiary);
    transition:transform var(--sui-switch-transtion-interval) ease
}

.sui-switch[data-size=s] {
    width: 2.25rem;
    height:1.38rem
}

.sui-switch[data-size=s]:before {
    width: 1.13rem;
    height:1.13rem
}

.sui-switch[data-size=m] {
    width: 2.5rem;
    height:1.5rem
}

.sui-switch[data-size=m]:before {
    width: 1.25rem;
    height:1.25rem
}

.sui-switch[data-size=l] {
    width: 3rem;
    height:1.75rem
}

.sui-switch[data-size=l]:before {
    width: 1.5rem;
    height:1.5rem
}

.sui-switch:hover {
    background-color:var(--sui-color-neutral-80)
}

.sui-switch:active {
    background-color:var(--sui-color-neutral-120)
}

.sui-switch:disabled {
    pointer-events:none
}

.sui-switch:disabled:before {
    background-color: var(--sui-color-tertiary);
    border-color:transparent
}

.sui-switch:checked {
    background-color: var(--sui-color-accent-100);
    border-color:transparent
}

.sui-switch:checked:before {
    transform: translate(calc(100% - .25rem));
    border-color: transparent;
    background-color:var(--sui-color-white)
}

.sui-switch:checked:hover {
    background-color: var(--sui-color-accent-80);
    border-color:transparent
}

.sui-switch:checked:active {
    background-color: var(--sui-color-accent-120);
    border-color:transparent
}

.sui-switch:checked:disabled {
    background-color: var(--sui-color-tertiary);
    border-color:transparent
}

.sui-accordion-button {
    width: 100%;
    border: 1px solid var(--sui-color-tertiary);
    display: flex;
    justify-content: space-between;
    align-items:center
}

.sui-accordion-button:hover {
    background-color:var(--sui-color-neutral-80)
}

.sui-accordion-button:active {
    background-color:var(--sui-color-neutral-120)
}

.sui-accordion[data-size=s] > .sui-accordion-button {
    height: 2.5rem;
    border-radius: .5rem;
    padding:.75rem 1rem
}

.sui-accordion[data-size=m] > .sui-accordion-button {
    height: 3rem;
    border-radius: .75rem;
    padding:.94rem 1.25rem
}

.sui-accordion[data-size=l] > .sui-accordion-button {
    height: 3.5rem;
    border-radius: 1rem;
    padding:1rem 1.25rem
}

.sui-accordion[data-button-open=true] > .sui-accordion-button {
    background-color: var(--sui-color-neutral-100);
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-bottom:none
}

.sui-accordion[data-button-open=true] > .sui-accordion-button:hover {
    background-color:var(--sui-color-neutral-80)
}

.sui-accordion[data-button-open=true] > .sui-accordion-button:active {
    background-color:var(--sui-color-neutral-120)
}

.sui-accordion-button .sui-accordion-button-content {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: .5rem;
    color: var(--sui-color-primary);
    font-family: Inter, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", Segoe UI Symbol, "Noto Color Emoji"
}

.sui-accordion[data-size=s] > .sui-accordion-button .sui-accordion-button-content {
    font-size: .8125rem;
    line-height: 1rem;
    font-weight:600
}

.sui-accordion[data-size=m] > .sui-accordion-button .sui-accordion-button-content {
    font-size: .9375rem;
    line-height: 1.125rem;
    font-weight:600
}

.sui-accordion[data-size=l] > .sui-accordion-button .sui-accordion-button-content {
    font-size: 1.0625rem;
    line-height: 1.25rem;
    font-weight:600
}

.font-rothorn.sui-accordion[data-size=l] > .sui-accordion-button .sui-accordion-button-content, .font-rothorn .sui-accordion[data-size=l] > .sui-accordion-button .sui-accordion-button-content {
    font-size: 1.0625rem;
    line-height: 1.25rem;
    font-weight:599
}

.sui-accordion-button .sui-accordion-button-chevron {
    color: var(--sui-color-secondary);
    transition:transform .2s ease
}

.sui-accordion[data-button-open=true] > .sui-accordion-button .sui-accordion-button-chevron {
    transform:rotate(180deg)
}

.sui-accordion-button .sui-accordion-button-icon {
    height: 1rem;
    width: 1rem;
    overflow:hidden
}

.sui-accordion-content {
    border: 1px solid var(--sui-color-tertiary);
    border-top: none;
    overflow:hidden
}

.sui-accordion[data-size=s] > .sui-accordion-content {
    min-height: 2.5rem;
    border-bottom-left-radius: .5rem;
    border-bottom-right-radius:.5rem
}

.sui-accordion[data-size=m] > .sui-accordion-content {
    min-height: 3rem;
    border-bottom-left-radius: .75rem;
    border-bottom-right-radius:.75rem
}

.sui-accordion[data-size=l] > .sui-accordion-content {
    min-height: 3.5rem;
    border-bottom-left-radius: 1rem;
    border-bottom-right-radius:1rem
}

.sui-group-list {
    display: flex;
    padding: .25rem;
    flex-direction: column;
    width:100%
}

.sui-group-list[data-size=l] {
    border-radius:1rem
}

.sui-group-list[data-size=m] {
    border-radius:.75rem
}

.sui-group-list[data-size=s] {
    border-radius:.5rem
}

.sui-group-list[data-orientation=vertical] {
    flex-direction: column;
    gap:.25rem
}

.sui-group-list[data-orientation=horizontal] {
    overflow: auto;
    flex-direction: row;
    position: relative;
    gap:calc(.5rem + 1px)
}

.sui-group-list[data-orientation=horizontal] .sui-group-list-item:not(:last-child):after {
    content: "";
    position: absolute;
    right: calc(-1 *(.25rem + 1px));
    height: 100%;
    border-right: 1px solid var(--sui-color-tertiary);
    margin-left:.25rem
}

.sui-group-list-item {
    display: grid;
    position: relative;
    flex: 1;
    grid-template-columns: min-content max-content;
    grid-template-rows: auto;
    grid-template-areas: "input content"
}

.sui-group-list-item:has(input:focus-visible) {
    border:2px solid var(--sui-color-accent-100)
}

.sui-group-list-item:has(input:focus-visible) input:focus-visible {
    outline:none
}

.sui-group-list-item[data-hint=true][data-hint-position=bottom] {
    grid-template-rows: auto auto;
    grid-template-areas: "input content" "blank hint"
}

.sui-group-list-item[data-hint=true][data-hint-position=right] {
    grid-template-columns: min-content max-content 1fr;
    grid-template-areas: "input content hint"
}

.sui-group-list-item[data-hint=true][data-hint-position=right] .sui-group-list-item__hint {
    margin-top: 0;
    margin-left: 1.25rem;
    justify-content:flex-end
}

.sui-group-list-item:not(:disabled) {
    cursor:pointer
}

.sui-group-list-item[data-size=l] {
    font-size: 1.0625rem;
    line-height: 1.25rem;
    font-weight:400
}

.font-rothorn.sui-group-list-item[data-size=l], .font-rothorn .sui-group-list-item[data-size=l] {
    font-size: 1.0625rem;
    line-height: 1.5rem;
    font-weight:420
}

.sui-group-list-item[data-size=l] {
    padding: 1rem 1.25rem;
    min-height: 3.5rem;
    border-radius:.75rem
}

.sui-group-list-item[data-size=l] .sui-group-list-item__hint {
    margin-top:.25rem
}

.sui-group-list-item[data-size=l]:has(input:focus-visible) {
    padding:.875rem 1.125rem
}

.sui-group-list-item[data-size=m] {
    font-size: .9375rem;
    line-height: 1.125rem;
    font-weight:400
}

.font-rothorn.sui-group-list-item[data-size=m], .font-rothorn .sui-group-list-item[data-size=m] {
    font-size: 1rem;
    line-height: 1.5rem;
    font-weight:420
}

.sui-group-list-item[data-size=m] {
    padding: .875rem 1rem;
    min-height: 3rem;
    border-radius:.5rem
}

.sui-group-list-item[data-size=m] .sui-group-list-item__hint {
    margin-top:.125rem
}

.sui-group-list-item[data-size=m]:has(input:focus-visible) {
    padding:.75rem .875rem
}

.sui-group-list-item[data-size=s] {
    font-size: .9375rem;
    line-height: 1.125rem;
    font-weight:400
}

.font-rothorn.sui-group-list-item[data-size=s], .font-rothorn .sui-group-list-item[data-size=s] {
    font-size: 1rem;
    line-height: 1.5rem;
    font-weight:420
}

.sui-group-list-item[data-size=s] {
    padding: .75rem;
    min-height: 2.5rem;
    border-radius:.25rem
}

.sui-group-list-item[data-size=s] .sui-group-list-item__hint {
    margin-top:.125rem
}

.sui-group-list-item[data-size=s]:has(input:focus-visible) {
    padding: .625rem
}

.sui-group-list-item[data-appearance=""] {
    pointer-events: none;
    color: var(--sui-color-secondary)
}

.sui-group-list-item[data-appearance=""]:has(input:checked):before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    background-color: var(--sui-color-neutral-80)
}

.sui-group-list-item[data-appearance=""][data-selectable=true] {
    pointer-events: auto;
    color:var(--sui-color-primary)
}

@media (hover: hover) {
    .sui-group-list-item[data-appearance=""][data-selectable=true]:hover {
        background-color: var(--sui-color-neutral-100)
    }
}

.sui-group-list-item[data-appearance=""][data-selectable=true]:active {
    background-color: var(--sui-color-neutral-120)
}

.sui-group-list-item[data-appearance=""][data-selectable=true]:has(input:checked):before {
    background-color:var(--sui-color-accent-10)
}

@media (hover: hover) {
    .sui-group-list-item[data-appearance=""][data-selectable=true]:has(input:checked):hover {
        background-color: var(--sui-color-neutral-80)
    }
}

.sui-group-list-item[data-appearance=""][data-selectable=true]:has(input:checked):active {
    background-color: var(--sui-color-neutral-100)
}

.sui-group-list-item[data-appearance=""][data-selectable=true][data-active=true] {
    background-color:var(--sui-color-neutral-120)
}

.sui-group-list-item__input {
    grid-area: input;
    display: flex;
    align-items:center
}

.sui-group-list-item__content {
    grid-area: content;
    display: flex;
    align-items: center;
    width: 100%;
    white-space:nowrap
}

.sui-group-list-item__hint {
    grid-area: hint;
    text-align: start;
    display: flex;
    align-items: center;
    color:var(--sui-color-secondary)
}

.sui-group-list-item-input[data-size=l] {
    margin-right: .75rem;
    min-height:1.25rem
}

.sui-group-list-item-input[data-size=m] {
    margin-right: .5rem;
    min-height:1.125rem
}

.sui-group-list-item-input[data-size=s] {
    margin-right: .5rem;
    min-height:1rem
}

.font-rothorn.text-heading-xxl, .font-rothorn .text-heading-xxl {
    font-size: 3.5rem;
    line-height: 5rem;
    font-weight:599
}

.font-rothorn.text-heading-xl, .font-rothorn .text-heading-xl {
    font-size: 3rem;
    line-height: 3.75rem;
    font-weight:599
}

.font-rothorn.text-heading-l, .font-rothorn .text-heading-l {
    font-size: 1.875rem;
    line-height: 2.5rem;
    font-weight:599
}

.font-rothorn.text-heading-lm, .font-rothorn .text-heading-lm {
    font-size: 1.625rem;
    line-height: 2.5rem;
    font-weight:599
}

.font-rothorn.text-heading-m, .font-rothorn .text-heading-m {
    font-size: 1.25rem;
    line-height: 1.5rem;
    font-weight:599
}

.font-rothorn.text-heading-s, .font-rothorn .text-heading-s {
    font-size: 1.0625rem;
    line-height: 1.25rem;
    font-weight:599
}

.font-rothorn.text-body-l, .font-rothorn .text-body-l {
    font-size: 1.0625rem;
    line-height: 1.5rem;
    font-weight:420
}

.font-rothorn.text-body-m, .font-rothorn .text-body-m {
    font-size: 1rem;
    line-height: 1.5rem;
    font-weight:420
}

.font-rothorn.text-body-s, .font-rothorn .text-body-s {
    font-size: .875rem;
    line-height: 1.5rem;
    font-weight:420
}

.font-rothorn.text-body-xs, .font-rothorn .text-body-xs {
    font-size: .75rem;
    line-height: 1.25rem;
    font-weight:420
}

@keyframes cdk-text-field-autofill-start {
}

@keyframes cdk-text-field-autofill-end {
}

.cdk-text-field-autofill-monitored:-webkit-autofill {
    animation:cdk-text-field-autofill-start 0s 1ms
}

.cdk-text-field-autofill-monitored:not(:-webkit-autofill) {
    animation:cdk-text-field-autofill-end 0s 1ms
}

.public-theme, [data-theme=public] {
    --sui-color-primary: #121416;
    --sui-color-secondary: rgba(23, 28, 38, .45);
    --sui-color-tertiary: rgba(0, 12, 36, .22);
    --sui-color-neutral-120: rgba(33, 60, 112, .11);
    --sui-color-neutral-100: rgba(0, 37, 112, .04);
    --sui-color-neutral-80: rgba(75, 113, 189, .04);
    --sui-color-neutral-bg: #f5f6f9;
    --sui-color-white: #ffffff;
    --sui-color-brand-120: #e04500;
    --sui-color-brand-100: #ff5d15;
    --sui-color-brand-80: #ff6e14;
    --sui-color-accent-120: #1502c0;
    --sui-color-accent-100: #2401fe;
    --sui-color-accent-80: #548eff;
    --sui-color-accent-20: rgba(23, 81, 229, .19);
    --sui-color-accent-10: rgba(36, 1, 254, .05);
    --sui-color-success-120: #0fa844;
    --sui-color-success-100: #10ba4c;
    --sui-color-success-80: #12cf54;
    --sui-color-success-10: rgba(13, 193, 67, .1);
    --sui-color-stop-120: #e00b0b;
    --sui-color-stop-100: #fe1212;
    --sui-color-stop-80: #ff5252;
    --sui-color-stop-10: rgba(255, 0, 0, .07);
    --sui-color-attention-100: #ff9500;
    --sui-color-attention-10: rgba(254, 183, 1, .1);
    --sui-color-transparent: transparent;
    --sui-color-dark-20: rgba(0, 0, 0, .2);
    --sui-color-dark-70: rgba(0, 0, 0, .7);
    --sui-color-dark-85: rgba(0, 0, 0, .85)
}

.sui-button[data-size=s] {
    border-radius:.75rem
}

.after\:block:after {
    content: var(--tw-content);
    display:block
}

.after\:h-6:after {
    content: var(--tw-content);
    height:1.5rem
}

.after\:w-6:after {
    content: var(--tw-content);
    width:1.5rem
}

@keyframes loader-clip-paths {
    0% {
        content: var(--tw-content);
        clip-path:polygon(50% 50%, 0 0, 50% 0%, 50% 0%, 50% 0%, 50% 0%, 50% 0%)
    }

    12.5% {
        content: var(--tw-content);
        clip-path:polygon(50% 50%, 0 0, 50% 0%, 100% 0%, 100% 0%, 100% 0%, 100% 0%)
    }

    25% {
        content: var(--tw-content);
        clip-path:polygon(50% 50%, 0 0, 50% 0%, 100% 0%, 100% 100%, 100% 100%, 100% 100%)
    }

    50% {
        content: var(--tw-content);
        clip-path:polygon(50% 50%, 0 0, 50% 0%, 100% 0%, 100% 100%, 50% 100%, 0% 100%)
    }

    62.5% {
        content: var(--tw-content);
        clip-path:polygon(50% 50%, 100% 0, 100% 0%, 100% 0%, 100% 100%, 50% 100%, 0% 100%)
    }

    75% {
        content: var(--tw-content);
        clip-path:polygon(50% 50%, 100% 100%, 100% 100%, 100% 100%, 100% 100%, 50% 100%, 0% 100%)
    }

    to {
        content: var(--tw-content);
        clip-path:polygon(50% 50%, 50% 100%, 50% 100%, 50% 100%, 50% 100%, 50% 100%, 0% 100%)
    }
}

@keyframes loader-rotate {
    0% {
        content: var(--tw-content);
        transform:scaleY(1) rotate(0)
    }

    49.9% {
        content: var(--tw-content);
        transform:scaleY(1) rotate(135deg)
    }

    50% {
        content: var(--tw-content);
        transform:scaleY(-1) rotate(0)
    }

    to {
        content: var(--tw-content);
        transform:scaleY(-1) rotate(-135deg)
    }
}

.after\:animate-loader:after {
    content: var(--tw-content);
    animation:loader-clip-paths .8s infinite linear alternate, loader-rotate 1.6s infinite linear
}

.after\:rounded-full:after {
    content: var(--tw-content);
    border-radius:9999px
}

.after\:border-2:after {
    content: var(--tw-content);
    border-width:2px
}

.after\:border-solid:after {
    content: var(--tw-content);
    border-style:solid
}

.after\:border-brand-100:after {
    content: var(--tw-content);
    border-color: var(--sui-color-brand-100)
}

.after\:content-\[\\\]:after {
    --tw-content: "";
    content:var(--tw-content)
}

.hover\:text-\[\#8ab4f8\]:hover {
    --tw-text-opacity: 1;
    color:rgb(138 180 248 / var(--tw-text-opacity))
}

.data-\[content-type\=select\]\:cursor-pointer[data-content-type=select] {
    cursor:pointer
}

@media (min-width: 768px) {
    .md\:mb-10 {
        margin-bottom:2.5rem
    }

    .md\:w-auto {
        width:auto
    }

    .md\:flex-row {
        flex-direction:row
    }

    .md\:items-start {
        align-items:flex-start
    }

    .md\:items-end {
        align-items:flex-end
    }

    .md\:gap-10 {
        gap:2.5rem
    }

    .md\:py-15 {
        padding-top: 3.75rem;
        padding-bottom:3.75rem
    }

    .md\:text-left {
        text-align:left
    }
}

@media (min-width: 1024px) {
    .lg\:absolute {
        position:absolute
    }

    .lg\:ml-0 {
        margin-left:0
    }

    .lg\:mr-0 {
        margin-right:0
    }

    .lg\:flex {
        display:flex
    }

    .lg\:h-20 {
        height:5rem
    }

    .lg\:h-\[372px\] {
        height:372px
    }

    .lg\:h-full {
        height:100%
    }

    .lg\:w-\[25\.875rem\] {
        width:25.875rem
    }

    .lg\:w-auto {
        width:auto
    }

    .lg\:max-w-full {
        max-width:100%
    }

    .lg\:p-10 {
        padding:2.5rem
    }

    .lg\:px-10 {
        padding-left: 2.5rem;
        padding-right:2.5rem
    }

    .lg\:py-12 {
        padding-top: 3rem;
        padding-bottom:3rem
    }

    .lg\:py-20 {
        padding-top: 5rem;
        padding-bottom:5rem
    }

    .lg\:pb-2 {
        padding-bottom:.5rem
    }

    .lg\:pb-20 {
        padding-bottom:5rem
    }

    .lg\:pb-4 {
        padding-bottom:1rem
    }

    .lg\:pl-12 {
        padding-left:3rem
    }

    .lg\:pt-8 {
        padding-top:2rem
    }

    .lg\:text-left {
        text-align:left
    }
}

@media screen and (min-width: 48rem) {
    .tablet-min\:h-28 {
        height:7rem
    }

    .tablet-min\:w-28 {
        width:7rem
    }

    .tablet-min\:max-w-\[23\.375rem\] {
        max-width:23.375rem
    }
}

@media screen and (min-width: 67.5rem) {
    .tabletL-min\:block {
        display:block
    }

    .tabletL-min\:w-1\/2 {
        width:50%
    }
}

@media screen and (min-width: 80rem) {
    .desktop-min\:max-w-\[23\.375rem\] {
        max-width:23.375rem
    }
}

@media (orientation: landscape) {
    .landscape\:flex-col {
        flex-direction:column
    }

    .landscape\:items-start {
        align-items:flex-start
    }

    .landscape\:pt-5 {
        padding-top:1.25rem
    }
}

.\[\&\ > \ * \]\:pointer-events-auto > * {
    pointer-events:auto
}

:root {
    --tui-heading-font: "Manrope", -apple-system, "BlinkMacSystemFont", system-ui, "Roboto", "Segoe UI", "Helvetica Neue", sans-serif;
    --tui-text-font: "Manrope", -apple-system, "BlinkMacSystemFont", system-ui, "Roboto", "Segoe UI", "Helvetica Neue", sans-serif;
    --tui-font-heading: var(--tui-heading-font);
    --tui-font-heading-1: bold 3.125rem/3.5rem var(--tui-font-heading);
    --tui-font-heading-2: bold 2.75rem/3rem var(--tui-font-heading);
    --tui-font-heading-3: bold 2.25rem/2.5rem var(--tui-font-heading);
    --tui-font-heading-4: bold 1.75rem/2rem var(--tui-font-heading);
    --tui-font-heading-5: bold 1.5rem/1.75rem var(--tui-font-heading);
    --tui-font-heading-6: bold 1.25rem/1.5rem var(--tui-font-heading);
    --tui-font-text: var(--tui-text-font);
    --tui-font-text-xl: normal 1.1875rem/1.75rem var(--tui-font-text);
    --tui-font-text-l: normal 1.0625rem/1.75rem var(--tui-font-text);
    --tui-font-text-l-2: normal 1.0625rem/1.5rem var(--tui-font-text);
    --tui-font-text-m: normal 1rem/1.5rem var(--tui-font-text);
    --tui-font-text-m-2: normal 1rem/1.25rem var(--tui-font-text);
    --tui-font-text-s: normal .8125rem/1.25rem var(--tui-font-text);
    --tui-font-text-s-2: normal .8125rem/1rem var(--tui-font-text);
    --tui-font-text-xs: normal .6875rem/1rem var(--tui-font-text);
    --tui-font-text-xs-2: normal .6875rem/.8125rem var(--tui-font-text);
    --tui-radius-xs: .25rem;
    --tui-radius-s: .5rem;
    --tui-radius-m: .75rem;
    --tui-radius-l: .75rem;
    --tui-radius-xl: 1.5rem;
    --tui-height-xs: 1.5rem;
    --tui-height-s: 2rem;
    --tui-height-m: 2.75rem;
    --tui-height-l: 3.5rem;
    --tui-padding-s: .75rem;
    --tui-padding-m: .75rem;
    --tui-padding-l: 1rem;
    --tui-duration: .3s;
    --tui-backdrop: none;
    --tui-disabled-opacity: .56;
    --tui-autofill: #fff5c0;
    --tui-base-01: #fff;
    --tui-base-02: #f6f6f6;
    --tui-base-03: #ededed;
    --tui-base-04: #d7d7d7;
    --tui-base-05: #b0b0b0;
    --tui-base-06: #959595;
    --tui-base-07: #808080;
    --tui-base-08: #333;
    --tui-base-09: #000;
    --tui-primary: #526ed3;
    --tui-primary-hover: #6c86e2;
    --tui-primary-active: #314692;
    --tui-primary-text: #fff;
    --tui-secondary: #ebefff;
    --tui-secondary-hover: #dfe3f3;
    --tui-secondary-active: #d8ddf2;
    --tui-accent: #ff7043;
    --tui-accent-hover: #ff9a94;
    --tui-accent-active: #e7716a;
    --tui-accent-text: #fff;
    --tui-selection: rgba(112, 182, 246, .12);
    --tui-focus: rgba(51, 51, 51, .64);
    --tui-clear: rgba(0, 0, 0, .04);
    --tui-clear-disabled: rgba(0, 0, 0, .04);
    --tui-clear-hover: rgba(0, 0, 0, .16);
    --tui-clear-active: rgba(0, 0, 0, .2);
    --tui-clear-inverse: rgba(255, 255, 255, .16);
    --tui-clear-inverse-hover: rgba(255, 255, 255, .24);
    --tui-clear-inverse-active: rgba(255, 255, 255, .4);
    --tui-elevation-01: #fff;
    --tui-elevation-02: #fff;
    --tui-error-fill: #f45725;
    --tui-error-bg: rgba(244, 87, 37, .12);
    --tui-error-bg-hover: rgba(244, 87, 37, .24);
    --tui-success-fill: #4ac99b;
    --tui-success-bg: rgba(74, 201, 155, .12);
    --tui-success-bg-hover: rgba(74, 201, 155, .24);
    --tui-warning-fill: #ffc700;
    --tui-warning-bg: rgba(255, 199, 0, .12);
    --tui-warning-bg-hover: rgba(255, 199, 0, .24);
    --tui-info-fill: #70b6f6;
    --tui-info-bg: rgba(112, 182, 246, .12);
    --tui-info-bg-hover: rgba(112, 182, 246, .24);
    --tui-neutral-fill: #79818c;
    --tui-neutral-bg: rgba(121, 129, 140, .12);
    --tui-neutral-bg-hover: rgba(121, 129, 140, .24);
    --tui-text-01: #1b1f3b;
    --tui-text-02: rgba(27, 31, 59, .65);
    --tui-text-03: rgba(27, 31, 59, .4);
    --tui-link: #526ed3;
    --tui-link-hover: #6c86e2;
    --tui-positive: #3aa981;
    --tui-positive-hover: #7ac5aa;
    --tui-negative: #dd4c1e;
    --tui-negative-hover: #e38163;
    --tui-error-fill-night: #ff8c67;
    --tui-error-bg-night: rgba(244, 87, 37, .32);
    --tui-error-bg-night-hover: rgba(244, 87, 37, .4);
    --tui-success-fill-night: #4ac99b;
    --tui-success-bg-night: rgba(74, 201, 155, .32);
    --tui-success-bg-night-hover: rgba(74, 201, 155, .4);
    --tui-warning-fill-night: #ffc700;
    --tui-warning-bg-night: rgba(255, 199, 0, .32);
    --tui-warning-bg-night-hover: rgba(255, 199, 0, .4);
    --tui-info-fill-night: #70b6f6;
    --tui-info-bg-night: rgba(112, 182, 246, .32);
    --tui-info-bg-night-hover: rgba(112, 182, 246, .4);
    --tui-neutral-fill-night: #959ba4;
    --tui-neutral-bg-night: rgba(149, 155, 164, .32);
    --tui-neutral-bg-night-hover: rgba(149, 155, 164, .48);
    --tui-autofill-night: #554a2a;
    --tui-text-01-night: #ffffff;
    --tui-text-02-night: rgba(255, 255, 255, .72);
    --tui-text-03-night: rgba(255, 255, 255, .6);
    --tui-link-night: #6788ff;
    --tui-link-night-hover: #526ed3;
    --tui-positive-night: #44c596;
    --tui-positive-night-hover: #3aa981;
    --tui-negative-night: #ff8c67;
    --tui-negative-night-hover: #bb593a;
    --tui-support-01: #a8cef1;
    --tui-support-02: #3682db;
    --tui-support-03: #8dda71;
    --tui-support-04: #34b41f;
    --tui-support-05: #e29398;
    --tui-support-06: #b8474e;
    --tui-support-07: #fcc068;
    --tui-support-08: #ff8a00;
    --tui-support-09: #dab3f9;
    --tui-support-10: #7b439e;
    --tui-support-11: #fee797;
    --tui-support-12: #fcbb14;
    --tui-support-13: #ea97c4;
    --tui-support-14: #bd65a4;
    --tui-support-15: #7fd7cc;
    --tui-support-16: #2fad96;
    --tui-support-17: #d4aca2;
    --tui-support-18: #9d6f64;
    --tui-support-19: #d2e9a2;
    --tui-support-20: #aadc42;
    --tui-support-21: #a0c5df;
    --tui-chart-0: var(--tui-primary);
    --tui-chart-1: var(--tui-support-13);
    --tui-chart-2: var(--tui-support-21);
    --tui-chart-3: var(--tui-support-11);
    --tui-chart-4: var(--tui-base-05);
    --tui-shadow: 0 .25rem 1.5rem rgba(0, 0, 0, .12);
    --tui-shadow-hover: 0 .75rem 2.25rem rgba(0, 0, 0, .2);
    --tui-shadow-dropdown: 0 1.5rem 1rem rgba(0, 0, 0, .03), 0 .75rem .75rem rgba(0, 0, 0, .04), 0 .25rem .375rem rgba(0, 0, 0, .05);
    --tui-shadow-modal: 0 1.125rem 1.875rem rgba(0, 0, 0, .48);
    --tui-shadow-sidebar: .25rem 0 1.5rem rgba(0, 0, 0, .12);
    --tui-shadow-navigation: 0 .125rem 1rem rgba(0, 0, 0, .08);
    --tui-shadow-sheet: 0 -1rem 1.75rem rgba(0, 0, 0, .24)
}

[tuiTheme=night] {
    --tui-base-01: #222;
    --tui-base-02: #333;
    --tui-base-03: #808080;
    --tui-base-04: #959595;
    --tui-base-05: #b0b0b0;
    --tui-base-06: #d7d7d7;
    --tui-base-07: #ededed;
    --tui-base-08: #f6f6f6;
    --tui-base-09: #fff;
    --tui-focus: rgba(255, 255, 255, .64);
    --tui-secondary: rgba(255, 255, 255, .16);
    --tui-secondary-hover: rgba(255, 255, 255, .24);
    --tui-secondary-active: rgba(255, 255, 255, .4);
    --tui-clear: rgba(255, 255, 255, .16);
    --tui-clear-disabled: rgba(255, 255, 255, .08);
    --tui-clear-hover: rgba(255, 255, 255, .24);
    --tui-clear-active: rgba(255, 255, 255, .4);
    --tui-error-fill: #ff8c67;
    --tui-error-bg: rgba(244, 87, 37, .32);
    --tui-error-bg-hover: rgba(244, 87, 37, .4);
    --tui-success-fill: #4ac99b;
    --tui-success-bg: rgba(74, 201, 155, .32);
    --tui-success-bg-hover: rgba(74, 201, 155, .4);
    --tui-warning-fill: #ffc700;
    --tui-warning-bg: rgba(255, 199, 0, .32);
    --tui-warning-bg-hover: rgba(255, 199, 0, .4);
    --tui-info-fill: #70b6f6;
    --tui-info-bg: rgba(112, 182, 246, .32);
    --tui-info-bg-hover: rgba(112, 182, 246, .4);
    --tui-neutral-fill: #959ba4;
    --tui-neutral-bg: rgba(149, 155, 164, .32);
    --tui-neutral-bg-hover: rgba(149, 155, 164, .48);
    --tui-text-01: #ffffff;
    --tui-text-02: rgba(255, 255, 255, .72);
    --tui-text-03: rgba(255, 255, 255, .6);
    --tui-link: #6788ff;
    --tui-link-hover: #526ed3;
    --tui-positive: #44c596;
    --tui-positive-hover: #3aa981;
    --tui-negative: #ff8c67;
    --tui-negative-hover: #bb593a;
    --tui-autofill: var(--tui-autofill-night);
    --tui-elevation-01: #222;
    --tui-elevation-02: #222;
    --tui-shadow: 0 .25rem 1.5rem rgba(0, 0, 0, .12);
    --tui-shadow-hover: 0 .75rem 2.25rem rgba(0, 0, 0, .2);
    --tui-shadow-dropdown: 0 1.5rem 1rem rgba(0, 0, 0, .03), 0 .75rem .75rem rgba(0, 0, 0, .04), 0 .25rem .375rem rgba(0, 0, 0, .05);
    --tui-shadow-modal: 0 1.125rem 1.875rem rgba(0, 0, 0, .48);
    --tui-shadow-sidebar: .25rem 0 1.5rem rgba(0, 0, 0, .12);
    --tui-shadow-navigation: 0 .125rem 1rem rgba(0, 0, 0, .08);
    --tui-shadow-sheet: 0 -1rem 1.75rem rgba(0, 0, 0, .24)
}

[tuiTheme=night] tui-notification {
    --tui-base-01: #000
}

[tuiAppearance] {
    transition-property: color, background, opacity, box-shadow;
    transition-duration: var(--tui-duration, .3s);
    transition-timing-function: ease-in-out;
    position: relative;
    appearance: none;
    outline: .125rem solid transparent;
    outline-offset:-.125rem
}

[tuiAppearance]:focus-visible:not([data-focus=false]), [tuiAppearance][data-focus=true] {
    outline-color:var(--tui-focus)
}

[tuiAppearance]:disabled:not([data-state]), [tuiAppearance][data-state=disabled] {
    pointer-events: none;
    opacity:var(--tui-disabled-opacity)
}

[tuiAppearance][data-appearance=accent] {
    background: var(--tui-accent);
    color:var(--tui-accent-text)
}

@media (hover: hover) {
    [tuiAppearance][data-appearance=accent]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background:var(--tui-accent-hover)
    }

    [tuiAppearance][data-appearance=accent]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background:var(--tui-accent-hover)
    }
}

[tuiAppearance][data-appearance=accent][data-state=hover] {
    background:var(--tui-accent-hover)
}

[tuiAppearance][data-appearance=accent]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background:var(--tui-accent-active)
}

[tuiAppearance][data-appearance=accent]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background:var(--tui-accent-active)
}

[tuiAppearance][data-appearance=accent][data-state=active] {
    background:var(--tui-accent-active)
}

[tuiAppearance][data-appearance=floating] {
    background: #fff;
    color: #000c;
    box-shadow:0 .25rem 1.25rem #0000001a
}

@media (hover: hover) {
    [tuiAppearance][data-appearance=floating]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        box-shadow:0 .875rem 2.625rem #00000024
    }

    [tuiAppearance][data-appearance=floating]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        box-shadow:0 .875rem 2.625rem #00000024
    }
}

[tuiAppearance][data-appearance=floating][data-state=hover] {
    box-shadow:0 .875rem 2.625rem #00000024
}

[tuiAppearance][data-appearance=floating]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background: #f6f7f8;
    box-shadow:0 .25rem 1.25rem #0000001a
}

[tuiAppearance][data-appearance=floating]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background: #f6f7f8;
    box-shadow:0 .25rem 1.25rem #0000001a
}

[tuiAppearance][data-appearance=floating][data-state=active] {
    background: #f6f7f8;
    box-shadow:0 .25rem 1.25rem #0000001a
}

[tuiAppearance][data-appearance=glass] {
    background: #0006;
    color: #fff;
    -webkit-backdrop-filter: blur(1rem);
    backdrop-filter: blur(1rem);
    --tui-focus: rgba(255, 255, 255, .64)
}

@media (hover: hover) {
    [tuiAppearance][data-appearance=glass]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background:#0000007a
    }

    [tuiAppearance][data-appearance=glass]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background:#0000007a
    }
}

[tuiAppearance][data-appearance=glass][data-state=hover] {
    background:#0000007a
}

[tuiAppearance][data-appearance=glass]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background:#0009
}

[tuiAppearance][data-appearance=glass]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background:#0009
}

[tuiAppearance][data-appearance=glass][data-state=active] {
    background:#0009
}

[tuiTheme=night] [tuiAppearance][data-appearance=glass] {
    background:#ffffff4d
}

@media (hover: hover) {
    [tuiTheme=night] [tuiAppearance][data-appearance=glass]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background:#fff6
    }

    [tuiTheme=night] [tuiAppearance][data-appearance=glass]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background:#fff6
    }
}

[tuiTheme=night] [tuiAppearance][data-appearance=glass][data-state=hover] {
    background:#fff6
}

[tuiTheme=night] [tuiAppearance][data-appearance=glass]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background:#ffffff80
}

[tuiTheme=night] [tuiAppearance][data-appearance=glass]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background:#ffffff80
}

[tuiTheme=night] [tuiAppearance][data-appearance=glass][data-state=active] {
    background:#ffffff80
}

[tuiAppearance][data-appearance=icon] {
    color:var(--tui-text-03)
}

@media (hover: hover) {
    [tuiAppearance][data-appearance=icon]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        color:var(--tui-text-02)
    }

    [tuiAppearance][data-appearance=icon]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        color:var(--tui-text-02)
    }
}

[tuiAppearance][data-appearance=icon][data-state=hover] {
    color:var(--tui-text-02)
}

[tuiAppearance][data-appearance=icon]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]) {
    color:var(--tui-text-01)
}

[tuiAppearance][data-appearance=icon]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]) {
    color:var(--tui-text-01)
}

[tuiAppearance][data-appearance=icon][data-state=active] {
    color:var(--tui-text-01)
}

[tuiAppearance][data-appearance=whiteblock]:before, [tuiAppearance][data-appearance=neutral]:before, [tuiAppearance][data-appearance=floating]:before, [tuiAppearance][data-appearance=whiteblock]:after, [tuiAppearance][data-appearance=neutral]:after, [tuiAppearance][data-appearance=floating]:after {
    transition-property: color;
    transition-duration: var(--tui-duration, .3s);
    transition-timing-function: ease-in-out;
    color:var(--tui-text-03)
}

@media (hover: hover) {
    [tuiAppearance][data-appearance=whiteblock]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]):before, [tuiAppearance][data-appearance=neutral]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]):before, [tuiAppearance][data-appearance=floating]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]):before, [tuiAppearance][data-appearance=whiteblock]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]):after, [tuiAppearance][data-appearance=neutral]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]):after, [tuiAppearance][data-appearance=floating]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]):after {
        color:var(--tui-text-02)
    }

    [tuiAppearance][data-appearance=whiteblock]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]):before, [tuiAppearance][data-appearance=neutral]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]):before, [tuiAppearance][data-appearance=floating]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]):before, [tuiAppearance][data-appearance=whiteblock]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]):after, [tuiAppearance][data-appearance=neutral]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]):after, [tuiAppearance][data-appearance=floating]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]):after {
        color:var(--tui-text-02)
    }
}

[tuiAppearance][data-appearance=whiteblock][data-state=hover]:before, [tuiAppearance][data-appearance=neutral][data-state=hover]:before, [tuiAppearance][data-appearance=floating][data-state=hover]:before, [tuiAppearance][data-appearance=whiteblock][data-state=hover]:after, [tuiAppearance][data-appearance=neutral][data-state=hover]:after, [tuiAppearance][data-appearance=floating][data-state=hover]:after {
    color:var(--tui-text-02)
}

[tuiAppearance][data-appearance=whiteblock]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]):before, [tuiAppearance][data-appearance=neutral]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]):before, [tuiAppearance][data-appearance=floating]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]):before, [tuiAppearance][data-appearance=whiteblock]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]):after, [tuiAppearance][data-appearance=neutral]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]):after, [tuiAppearance][data-appearance=floating]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]):after {
    color:var(--tui-text-01)
}

[tuiAppearance][data-appearance=whiteblock]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]):before, [tuiAppearance][data-appearance=neutral]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]):before, [tuiAppearance][data-appearance=floating]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]):before, [tuiAppearance][data-appearance=whiteblock]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]):after, [tuiAppearance][data-appearance=neutral]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]):after, [tuiAppearance][data-appearance=floating]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]):after {
    color:var(--tui-text-01)
}

[tuiAppearance][data-appearance=whiteblock][data-state=active]:before, [tuiAppearance][data-appearance=neutral][data-state=active]:before, [tuiAppearance][data-appearance=floating][data-state=active]:before, [tuiAppearance][data-appearance=whiteblock][data-state=active]:after, [tuiAppearance][data-appearance=neutral][data-state=active]:after, [tuiAppearance][data-appearance=floating][data-state=active]:after {
    color:var(--tui-text-01)
}

[tuiAppearance][data-appearance=link] {
    color:var(--tui-link)
}

@media (hover: hover) {
    [tuiAppearance][data-appearance=link]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        color:var(--tui-link-hover)
    }

    [tuiAppearance][data-appearance=link]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        color:var(--tui-link-hover)
    }
}

[tuiAppearance][data-appearance=link][data-state=hover] {
    color:var(--tui-link-hover)
}

[tuiAppearance][data-appearance=link]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]) {
    color:var(--tui-link-hover)
}

[tuiAppearance][data-appearance=link]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]) {
    color:var(--tui-link-hover)
}

[tuiAppearance][data-appearance=link][data-state=active] {
    color:var(--tui-link-hover)
}

[tuiAppearance][data-appearance=opposite] {
    --tui-focus: rgba(255, 255, 255, .64);
    background: #000;
    color:#fff
}

@media (hover: hover) {
    [tuiAppearance][data-appearance=opposite]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background:#333
    }

    [tuiAppearance][data-appearance=opposite]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background:#333
    }
}

[tuiAppearance][data-appearance=opposite][data-state=hover] {
    background:#333
}

[tuiAppearance][data-appearance=opposite]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background:#5c636b
}

[tuiAppearance][data-appearance=opposite]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background:#5c636b
}

[tuiAppearance][data-appearance=opposite][data-state=active] {
    background:#5c636b
}

[tuiTheme=night] [tuiAppearance][data-appearance=opposite] {
    --tui-focus: rgba(51, 51, 51, .48);
    color: #000c;
    background:#fff
}

@media (hover: hover) {
    [tuiTheme=night] [tuiAppearance][data-appearance=opposite]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background:#f3f4f6
    }

    [tuiTheme=night] [tuiAppearance][data-appearance=opposite]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background:#f3f4f6
    }
}

[tuiTheme=night] [tuiAppearance][data-appearance=opposite][data-state=hover] {
    background:#f3f4f6
}

[tuiTheme=night] [tuiAppearance][data-appearance=opposite]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background:#eaecee
}

[tuiTheme=night] [tuiAppearance][data-appearance=opposite]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background:#eaecee
}

[tuiTheme=night] [tuiAppearance][data-appearance=opposite][data-state=active] {
    background:#eaecee
}

[tuiAppearance][data-appearance=outline], [tuiAppearance][data-appearance=whiteblock] {
    background: transparent;
    color: var(--tui-link);
    box-shadow:inset 0 0 0 1px var(--tui-base-04)
}

@media (hover: hover) {
    [tuiAppearance][data-appearance=outline]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]), [tuiAppearance][data-appearance=whiteblock]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background: var(--tui-clear);
        box-shadow: inset 0 0 0 1px var(--tui-base-05);
        cursor:pointer
    }

    [tuiAppearance][data-appearance=outline]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]), [tuiAppearance][data-appearance=whiteblock]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background: var(--tui-clear);
        box-shadow: inset 0 0 0 1px var(--tui-base-05);
        cursor:pointer
    }
}

[tuiAppearance][data-appearance=outline][data-state=hover], [tuiAppearance][data-appearance=whiteblock][data-state=hover] {
    background: var(--tui-clear);
    box-shadow: inset 0 0 0 1px var(--tui-base-05);
    cursor:pointer
}

[tuiAppearance][data-appearance=outline]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]), [tuiAppearance][data-appearance=whiteblock]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background: var(--tui-clear);
    box-shadow:inset 0 0 0 1px var(--tui-base-06)
}

[tuiAppearance][data-appearance=outline]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]), [tuiAppearance][data-appearance=whiteblock]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background: var(--tui-clear);
    box-shadow:inset 0 0 0 1px var(--tui-base-06)
}

[tuiAppearance][data-appearance=outline][data-state=active], [tuiAppearance][data-appearance=whiteblock][data-state=active] {
    background: var(--tui-clear);
    box-shadow:inset 0 0 0 1px var(--tui-base-06)
}

[tuiAppearance][data-appearance=outline]:checked, [tuiAppearance][data-appearance=whiteblock]:checked, [tuiAppearance][data-appearance=outline]._checked, [tuiAppearance][data-appearance=whiteblock]._checked {
    box-shadow:inset 0 0 0 2px var(--tui-primary)
}

@media (hover: hover) {
    [tuiAppearance][data-appearance=outline]:checked:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]), [tuiAppearance][data-appearance=whiteblock]:checked:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]), [tuiAppearance][data-appearance=outline]._checked:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]), [tuiAppearance][data-appearance=whiteblock]._checked:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        box-shadow:inset 0 0 0 2px var(--tui-primary-hover)
    }

    [tuiAppearance][data-appearance=outline]:checked:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]), [tuiAppearance][data-appearance=whiteblock]:checked:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]), [tuiAppearance][data-appearance=outline]._checked:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]), [tuiAppearance][data-appearance=whiteblock]._checked:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        box-shadow:inset 0 0 0 2px var(--tui-primary-hover)
    }
}

[tuiAppearance][data-appearance=outline]:checked[data-state=hover], [tuiAppearance][data-appearance=whiteblock]:checked[data-state=hover], [tuiAppearance][data-appearance=outline]._checked[data-state=hover], [tuiAppearance][data-appearance=whiteblock]._checked[data-state=hover] {
    box-shadow:inset 0 0 0 2px var(--tui-primary-hover)
}

[tuiAppearance][data-appearance=outline]:checked:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]), [tuiAppearance][data-appearance=whiteblock]:checked:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]), [tuiAppearance][data-appearance=outline]._checked:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]), [tuiAppearance][data-appearance=whiteblock]._checked:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]) {
    box-shadow:inset 0 0 0 2px var(--tui-primary-active)
}

[tuiAppearance][data-appearance=outline]:checked:-moz-any(a, button, select, textarea, input, label):active:not([data-state]), [tuiAppearance][data-appearance=whiteblock]:checked:-moz-any(a, button, select, textarea, input, label):active:not([data-state]), [tuiAppearance][data-appearance=outline]._checked:-moz-any(a, button, select, textarea, input, label):active:not([data-state]), [tuiAppearance][data-appearance=whiteblock]._checked:-moz-any(a, button, select, textarea, input, label):active:not([data-state]) {
    box-shadow:inset 0 0 0 2px var(--tui-primary-active)
}

[tuiAppearance][data-appearance=outline]:checked[data-state=active], [tuiAppearance][data-appearance=whiteblock]:checked[data-state=active], [tuiAppearance][data-appearance=outline]._checked[data-state=active], [tuiAppearance][data-appearance=whiteblock]._checked[data-state=active] {
    box-shadow:inset 0 0 0 2px var(--tui-primary-active)
}

[tuiAppearance][data-appearance=whiteblock] {
    color:var(--tui-text-01)
}

[tuiAppearance][data-appearance=primary] {
    background: var(--tui-primary);
    color:var(--tui-primary-text)
}

@media (hover: hover) {
    [tuiAppearance][data-appearance=primary]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background:var(--tui-primary-hover)
    }

    [tuiAppearance][data-appearance=primary]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background:var(--tui-primary-hover)
    }
}

[tuiAppearance][data-appearance=primary][data-state=hover] {
    background:var(--tui-primary-hover)
}

[tuiAppearance][data-appearance=primary]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background:var(--tui-primary-active)
}

[tuiAppearance][data-appearance=primary]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background:var(--tui-primary-active)
}

[tuiAppearance][data-appearance=primary][data-state=active] {
    background:var(--tui-primary-active)
}

[tuiAppearance][data-appearance=secondary], [tuiAppearance][data-appearance=flat], [tuiAppearance][data-appearance=destructive] {
    background: var(--tui-secondary);
    color:var(--tui-link)
}

@media (hover: hover) {
    [tuiAppearance][data-appearance=secondary]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]), [tuiAppearance][data-appearance=flat]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]), [tuiAppearance][data-appearance=destructive]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background:var(--tui-secondary-hover)
    }

    [tuiAppearance][data-appearance=secondary]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]), [tuiAppearance][data-appearance=flat]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]), [tuiAppearance][data-appearance=destructive]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background:var(--tui-secondary-hover)
    }
}

[tuiAppearance][data-appearance=secondary][data-state=hover], [tuiAppearance][data-appearance=flat][data-state=hover], [tuiAppearance][data-appearance=destructive][data-state=hover] {
    background:var(--tui-secondary-hover)
}

[tuiAppearance][data-appearance=secondary]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]), [tuiAppearance][data-appearance=flat]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]), [tuiAppearance][data-appearance=destructive]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background:var(--tui-secondary-active)
}

[tuiAppearance][data-appearance=secondary]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]), [tuiAppearance][data-appearance=flat]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]), [tuiAppearance][data-appearance=destructive]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background:var(--tui-secondary-active)
}

[tuiAppearance][data-appearance=secondary][data-state=active], [tuiAppearance][data-appearance=flat][data-state=active], [tuiAppearance][data-appearance=destructive][data-state=active] {
    background:var(--tui-secondary-active)
}

[tuiAppearance][data-appearance=flat] {
    background:transparent
}

[tuiAppearance][data-appearance=destructive] {
    color:var(--tui-negative)
}

[tuiAppearance][data-appearance=error] {
    color: var(--tui-text-01);
    background:var(--tui-error-bg)
}

@media (hover: hover) {
    [tuiAppearance][data-appearance=error]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background:var(--tui-error-bg-hover)
    }

    [tuiAppearance][data-appearance=error]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background:var(--tui-error-bg-hover)
    }
}

[tuiAppearance][data-appearance=error][data-state=hover] {
    background:var(--tui-error-bg-hover)
}

[tuiAppearance][data-appearance=error]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background:var(--tui-error-bg-hover)
}

[tuiAppearance][data-appearance=error]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background:var(--tui-error-bg-hover)
}

[tuiAppearance][data-appearance=error][data-state=active] {
    background:var(--tui-error-bg-hover)
}

[tuiAppearance][data-appearance=success] {
    color: var(--tui-text-01);
    background:var(--tui-success-bg)
}

@media (hover: hover) {
    [tuiAppearance][data-appearance=success]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background:var(--tui-success-bg-hover)
    }

    [tuiAppearance][data-appearance=success]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background:var(--tui-success-bg-hover)
    }
}

[tuiAppearance][data-appearance=success][data-state=hover] {
    background:var(--tui-success-bg-hover)
}

[tuiAppearance][data-appearance=success]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background:var(--tui-success-bg-hover)
}

[tuiAppearance][data-appearance=success]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background:var(--tui-success-bg-hover)
}

[tuiAppearance][data-appearance=success][data-state=active] {
    background:var(--tui-success-bg-hover)
}

[tuiAppearance][data-appearance=warning] {
    color: var(--tui-text-01);
    background:var(--tui-warning-bg)
}

@media (hover: hover) {
    [tuiAppearance][data-appearance=warning]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background:var(--tui-warning-bg-hover)
    }

    [tuiAppearance][data-appearance=warning]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background:var(--tui-warning-bg-hover)
    }
}

[tuiAppearance][data-appearance=warning][data-state=hover] {
    background:var(--tui-warning-bg-hover)
}

[tuiAppearance][data-appearance=warning]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background:var(--tui-warning-bg-hover)
}

[tuiAppearance][data-appearance=warning]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background:var(--tui-warning-bg-hover)
}

[tuiAppearance][data-appearance=warning][data-state=active] {
    background:var(--tui-warning-bg-hover)
}

[tuiAppearance][data-appearance=info] {
    color: var(--tui-text-01);
    background:var(--tui-info-bg)
}

@media (hover: hover) {
    [tuiAppearance][data-appearance=info]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background:var(--tui-info-bg-hover)
    }

    [tuiAppearance][data-appearance=info]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background:var(--tui-info-bg-hover)
    }
}

[tuiAppearance][data-appearance=info][data-state=hover] {
    background:var(--tui-info-bg-hover)
}

[tuiAppearance][data-appearance=info]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background:var(--tui-info-bg-hover)
}

[tuiAppearance][data-appearance=info]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background:var(--tui-info-bg-hover)
}

[tuiAppearance][data-appearance=info][data-state=active] {
    background:var(--tui-info-bg-hover)
}

[tuiAppearance][data-appearance=neutral] {
    color: var(--tui-text-01);
    background:var(--tui-neutral-bg)
}

@media (hover: hover) {
    [tuiAppearance][data-appearance=neutral]:-webkit-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background:var(--tui-neutral-bg-hover)
    }

    [tuiAppearance][data-appearance=neutral]:-moz-any(a, button, select, textarea, input, label):hover:not([data-state]) {
        background:var(--tui-neutral-bg-hover)
    }
}

[tuiAppearance][data-appearance=neutral][data-state=hover] {
    background:var(--tui-neutral-bg-hover)
}

[tuiAppearance][data-appearance=neutral]:-webkit-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background:var(--tui-neutral-bg-hover)
}

[tuiAppearance][data-appearance=neutral]:-moz-any(a, button, select, textarea, input, label):active:not([data-state]) {
    background:var(--tui-neutral-bg-hover)
}

[tuiAppearance][data-appearance=neutral][data-state=active] {
    background:var(--tui-neutral-bg-hover)
}

[tuiWrapper][data-appearance=icon][data-appearance=icon] {
    transition-property: opacity;
    transition-duration: var(--tui-duration, .3s);
    transition-timing-function: ease-in-out;
    color: var(--tui-text-01);
    opacity:.5
}

[tuiWrapper]:not([data-state=readonly]):hover .t-textfield-icon [tuiWrapper][data-appearance=icon][data-appearance=icon]:not([data-state=disabled]) {
    opacity:.65
}

[tuiWrapper][data-appearance=icon][data-appearance=icon][data-mode=onDark] {
    color:var(--tui-text-01-night)
}

[tuiWrapper]:not([data-state=readonly]):hover .t-textfield-icon [tuiWrapper][data-appearance=icon][data-appearance=icon][data-mode=onDark]:not([data-state=disabled]) {
    opacity:1
}

:focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=icon][data-appearance=icon][data-mode=onDark], [data-focused=true] > [tuiWrapper][data-appearance=icon][data-appearance=icon][data-mode=onDark] {
    --tui-focus: var(--tui-base-01)
}

[tuiWrapper][data-appearance=icon][data-appearance=icon][data-mode=onDark]:focus-visible:focus-visible {
    --tui-focus: var(--tui-base-01)
}

[tuiWrapper][data-appearance=icon][data-appearance=icon][data-mode=onDark]._focused._focused {
    --tui-focus: var(--tui-base-01)
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=icon][data-appearance=icon][data-mode=onDark]:hover:not(._no-hover), [tuiWrapper][data-appearance=icon][data-appearance=icon][data-mode=onDark][data-state=hover] {
        opacity:1
    }

    [tuiWrapper][data-appearance=icon][data-appearance=icon]:hover:not(._no-hover), [tuiWrapper][data-appearance=icon][data-appearance=icon][data-state=hover] {
        opacity:.65
    }
}

[tuiWrapper][data-appearance=icon][data-appearance=icon]:active:not(._no-active), [tuiWrapper][data-appearance=icon][data-appearance=icon][data-state=active], [tuiWrapper][data-appearance=icon][data-appearance=icon][data-state=active]:hover {
    opacity:1
}

[tuiWrapper][data-appearance=icon][data-appearance=icon]:disabled:disabled, [tuiWrapper][data-appearance=icon][data-appearance=icon][data-state=disabled][data-state=disabled] {
    opacity:calc(.5 * var(--tui-disabled-opacity))
}

[tuiWrapper][data-appearance=outline] {
    background: transparent;
    color:var(--tui-text-01)
}

[tuiWrapper][data-appearance=outline]:after {
    color:var(--tui-base-04)
}

[tuiWrapper][data-appearance=outline][data-mode=onDark] {
    color:var(--tui-text-01-night)
}

[tuiWrapper][data-appearance=outline][data-mode=onDark]:after {
    color:var(--tui-text-01-night)
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=outline][data-mode=onDark]:hover:not(._no-hover), [tuiWrapper][data-appearance=outline][data-mode=onDark][data-state=hover] {
        background:var(--tui-clear-inverse-hover)
    }

    [tuiWrapper][data-appearance=outline][data-mode=onDark]:hover:not(._no-hover):after, [tuiWrapper][data-appearance=outline][data-mode=onDark][data-state=hover]:after {
        color:var(--tui-text-03-night)
    }
}

[tuiWrapper][data-appearance=outline][data-mode=onDark]:active:not(._no-active), [tuiWrapper][data-appearance=outline][data-mode=onDark][data-state=active], [tuiWrapper][data-appearance=outline][data-mode=onDark][data-state=active]:hover {
    background:var(--tui-clear-inverse-active)
}

[tuiWrapper][data-appearance=outline][data-mode=onDark]:active:not(._no-active):after, [tuiWrapper][data-appearance=outline][data-mode=onDark][data-state=active]:after, [tuiWrapper][data-appearance=outline][data-mode=onDark][data-state=active]:hover:after {
    color:var(--tui-text-03-night)
}

:focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=outline][data-mode=onDark], [data-focused=true] > [tuiWrapper][data-appearance=outline][data-mode=onDark] {
    --tui-focus: var(--tui-text-01-night)
}

[tuiWrapper][data-appearance=outline][data-mode=onDark]:focus-visible:focus-visible {
    --tui-focus: var(--tui-text-01-night)
}

[tuiWrapper][data-appearance=outline][data-mode=onDark]._focused._focused {
    --tui-focus: var(--tui-text-01-night)
}

[tuiWrapper][data-appearance=outline][data-mode=onLight] {
    color:var(--tui-text-01)
}

[tuiWrapper][data-appearance=outline][data-mode=onLight]:after {
    color:var(--tui-text-01)
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=outline][data-mode=onLight]:hover:not(._no-hover), [tuiWrapper][data-appearance=outline][data-mode=onLight][data-state=hover] {
        background:var(--tui-clear-hover)
    }

    [tuiWrapper][data-appearance=outline][data-mode=onLight]:hover:not(._no-hover):after, [tuiWrapper][data-appearance=outline][data-mode=onLight][data-state=hover]:after {
        color:var(--tui-text-03)
    }
}

[tuiWrapper][data-appearance=outline][data-mode=onLight]:active:not(._no-active), [tuiWrapper][data-appearance=outline][data-mode=onLight][data-state=active], [tuiWrapper][data-appearance=outline][data-mode=onLight][data-state=active]:hover {
    background:var(--tui-clear-active)
}

[tuiWrapper][data-appearance=outline][data-mode=onLight]:active:not(._no-active):after, [tuiWrapper][data-appearance=outline][data-mode=onLight][data-state=active]:after, [tuiWrapper][data-appearance=outline][data-mode=onLight][data-state=active]:hover:after {
    color:var(--tui-text-03)
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=outline]:hover:not(._no-hover):after, [tuiWrapper][data-appearance=outline][data-state=hover]:after {
        color:var(--tui-base-05)
    }
}

[tuiWrapper][data-appearance=outline]:active:not(._no-active):after, [tuiWrapper][data-appearance=outline][data-state=active]:after, [tuiWrapper][data-appearance=outline][data-state=active]:hover:after {
    color:var(--tui-base-06)
}

[tuiWrapper][data-appearance=primary] {
    background: var(--tui-primary);
    color:var(--tui-primary-text)
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=primary]:hover:not(._no-hover), [tuiWrapper][data-appearance=primary][data-state=hover] {
        background:var(--tui-primary-hover)
    }
}

[tuiWrapper][data-appearance=primary]:active:not(._no-active), [tuiWrapper][data-appearance=primary][data-state=active], [tuiWrapper][data-appearance=primary][data-state=active]:hover {
    background:var(--tui-primary-active)
}

[tuiWrapper][data-appearance=primary]:invalid:invalid, [tuiWrapper][data-appearance=primary]._invalid._invalid {
    color: var(--tui-negative-night);
    background:var(--tui-error-bg)
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=primary]:invalid:invalid:hover:not(._no-hover), [tuiWrapper][data-appearance=primary]._invalid._invalid:hover:not(._no-hover), [tuiWrapper][data-appearance=primary]:invalid:invalid[data-state=hover], [tuiWrapper][data-appearance=primary]._invalid._invalid[data-state=hover] {
        background:var(--tui-error-bg-hover)
    }
}

[tuiWrapper][data-appearance=primary]:invalid:invalid:active:not(._no-active), [tuiWrapper][data-appearance=primary]._invalid._invalid:active:not(._no-active), [tuiWrapper][data-appearance=primary]:invalid:invalid[data-state=active], [tuiWrapper][data-appearance=primary]._invalid._invalid[data-state=active], [tuiWrapper][data-appearance=primary]:invalid:invalid[data-state=active]:hover, [tuiWrapper][data-appearance=primary]._invalid._invalid[data-state=active]:hover {
    background:var(--tui-error-bg-hover)
}

:focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=primary]:invalid:invalid, :focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=primary]._invalid._invalid, [data-focused=true] > [tuiWrapper][data-appearance=primary]:invalid:invalid, [data-focused=true] > [tuiWrapper][data-appearance=primary]._invalid._invalid {
    --tui-focus: var(--tui-error-fill)
}

[tuiWrapper][data-appearance=primary]:invalid:invalid:focus-visible:focus-visible, [tuiWrapper][data-appearance=primary]._invalid._invalid:focus-visible:focus-visible {
    --tui-focus: var(--tui-error-fill)
}

[tuiWrapper][data-appearance=primary]:invalid:invalid._focused._focused, [tuiWrapper][data-appearance=primary]._invalid._invalid._focused._focused {
    --tui-focus: var(--tui-error-fill)
}

[tuiWrapper][data-appearance=accent] {
    background: var(--tui-accent);
    color:var(--tui-accent-text)
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=accent]:hover:not(._no-hover), [tuiWrapper][data-appearance=accent][data-state=hover] {
        background:var(--tui-accent-hover)
    }
}

[tuiWrapper][data-appearance=accent]:active:not(._no-active), [tuiWrapper][data-appearance=accent][data-state=active], [tuiWrapper][data-appearance=accent][data-state=active]:hover {
    background:var(--tui-accent-active)
}

[tuiWrapper][data-appearance=accent]:invalid:invalid, [tuiWrapper][data-appearance=accent]._invalid._invalid {
    color: var(--tui-negative-night);
    background:var(--tui-error-bg)
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=accent]:invalid:invalid:hover:not(._no-hover), [tuiWrapper][data-appearance=accent]._invalid._invalid:hover:not(._no-hover), [tuiWrapper][data-appearance=accent]:invalid:invalid[data-state=hover], [tuiWrapper][data-appearance=accent]._invalid._invalid[data-state=hover] {
        background:var(--tui-error-bg-hover)
    }
}

:focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=accent]:invalid:invalid, :focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=accent]._invalid._invalid, [data-focused=true] > [tuiWrapper][data-appearance=accent]:invalid:invalid, [data-focused=true] > [tuiWrapper][data-appearance=accent]._invalid._invalid {
    --tui-focus: var(--tui-error-fill)
}

[tuiWrapper][data-appearance=accent]:invalid:invalid:focus-visible:focus-visible, [tuiWrapper][data-appearance=accent]._invalid._invalid:focus-visible:focus-visible {
    --tui-focus: var(--tui-error-fill)
}

[tuiWrapper][data-appearance=accent]:invalid:invalid._focused._focused, [tuiWrapper][data-appearance=accent]._invalid._invalid._focused._focused {
    --tui-focus: var(--tui-error-fill)
}

[tuiWrapper][data-appearance=floating] {
    transition-property: background, box-shadow;
    transition-duration: var(--tui-duration, .3s);
    transition-timing-function: ease-in-out;
    background: #fff;
    color: #000c;
    box-shadow:0 .25rem 1.25rem #0000001a
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=floating]:hover:not(._no-hover), [tuiWrapper][data-appearance=floating][data-state=hover] {
        box-shadow:0 .875rem 2.625rem #00000024
    }
}

[tuiWrapper][data-appearance=floating]:active:not(._no-active), [tuiWrapper][data-appearance=floating][data-state=active], [tuiWrapper][data-appearance=floating][data-state=active]:hover {
    background: #f6f7f8;
    box-shadow:0 .25rem 1.25rem #0000001a
}

[tuiWrapper][data-appearance=glass] {
    background: #0006;
    color: #fff;
    -webkit-backdrop-filter: blur(1rem);
    backdrop-filter: blur(1rem);
    --tui-focus: rgba(255, 255, 255, .64)
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=glass]:hover:not(._no-hover), [tuiWrapper][data-appearance=glass][data-state=hover] {
        background:#0000007a
    }
}

[tuiWrapper][data-appearance=glass]:active:not(._no-active), [tuiWrapper][data-appearance=glass][data-state=active], [tuiWrapper][data-appearance=glass][data-state=active]:hover {
    background:#0009
}

[tuiWrapper][data-appearance=glass][data-mode=onDark] {
    background:#ffffff4d
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=glass][data-mode=onDark]:hover:not(._no-hover), [tuiWrapper][data-appearance=glass][data-mode=onDark][data-state=hover] {
        background:#fff6
    }
}

[tuiWrapper][data-appearance=glass][data-mode=onDark]:active:not(._no-active), [tuiWrapper][data-appearance=glass][data-mode=onDark][data-state=active], [tuiWrapper][data-appearance=glass][data-mode=onDark][data-state=active]:hover {
    background:#ffffff80
}

[tuiWrapper][data-appearance=secondary], [tuiWrapper][data-appearance=flat], [tuiWrapper][data-appearance=destructive] {
    background: var(--tui-secondary);
    color:var(--tui-link)
}

[tuiWrapper][data-appearance=secondary][data-mode=onDark], [tuiWrapper][data-appearance=flat][data-mode=onDark], [tuiWrapper][data-appearance=destructive][data-mode=onDark] {
    background: var(--tui-clear-inverse);
    color:var(--tui-text-01-night)
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=secondary][data-mode=onDark]:hover:not(._no-hover), [tuiWrapper][data-appearance=flat][data-mode=onDark]:hover:not(._no-hover), [tuiWrapper][data-appearance=destructive][data-mode=onDark]:hover:not(._no-hover), [tuiWrapper][data-appearance=secondary][data-mode=onDark][data-state=hover], [tuiWrapper][data-appearance=flat][data-mode=onDark][data-state=hover], [tuiWrapper][data-appearance=destructive][data-mode=onDark][data-state=hover] {
        background:var(--tui-clear-inverse-hover)
    }
}

[tuiWrapper][data-appearance=secondary][data-mode=onDark]:active:not(._no-active), [tuiWrapper][data-appearance=flat][data-mode=onDark]:active:not(._no-active), [tuiWrapper][data-appearance=destructive][data-mode=onDark]:active:not(._no-active), [tuiWrapper][data-appearance=secondary][data-mode=onDark][data-state=active], [tuiWrapper][data-appearance=flat][data-mode=onDark][data-state=active], [tuiWrapper][data-appearance=destructive][data-mode=onDark][data-state=active], [tuiWrapper][data-appearance=secondary][data-mode=onDark][data-state=active]:hover, [tuiWrapper][data-appearance=flat][data-mode=onDark][data-state=active]:hover, [tuiWrapper][data-appearance=destructive][data-mode=onDark][data-state=active]:hover {
    background:var(--tui-clear-inverse-active)
}

:focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=secondary][data-mode=onDark], :focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=flat][data-mode=onDark], :focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=destructive][data-mode=onDark], [data-focused=true] > [tuiWrapper][data-appearance=secondary][data-mode=onDark], [data-focused=true] > [tuiWrapper][data-appearance=flat][data-mode=onDark], [data-focused=true] > [tuiWrapper][data-appearance=destructive][data-mode=onDark] {
    --tui-focus: var(--tui-text-01-night)
}

[tuiWrapper][data-appearance=secondary][data-mode=onDark]:focus-visible:focus-visible, [tuiWrapper][data-appearance=flat][data-mode=onDark]:focus-visible:focus-visible, [tuiWrapper][data-appearance=destructive][data-mode=onDark]:focus-visible:focus-visible {
    --tui-focus: var(--tui-text-01-night)
}

[tuiWrapper][data-appearance=secondary][data-mode=onDark]._focused._focused, [tuiWrapper][data-appearance=flat][data-mode=onDark]._focused._focused, [tuiWrapper][data-appearance=destructive][data-mode=onDark]._focused._focused {
    --tui-focus: var(--tui-text-01-night)
}

[tuiWrapper][data-appearance=secondary][data-mode=onLight], [tuiWrapper][data-appearance=flat][data-mode=onLight], [tuiWrapper][data-appearance=destructive][data-mode=onLight] {
    background: var(--tui-clear);
    color:var(--tui-text-01)
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=secondary][data-mode=onLight]:hover:not(._no-hover), [tuiWrapper][data-appearance=flat][data-mode=onLight]:hover:not(._no-hover), [tuiWrapper][data-appearance=destructive][data-mode=onLight]:hover:not(._no-hover), [tuiWrapper][data-appearance=secondary][data-mode=onLight][data-state=hover], [tuiWrapper][data-appearance=flat][data-mode=onLight][data-state=hover], [tuiWrapper][data-appearance=destructive][data-mode=onLight][data-state=hover] {
        background:var(--tui-clear-hover)
    }
}

[tuiWrapper][data-appearance=secondary][data-mode=onLight]:active:not(._no-active), [tuiWrapper][data-appearance=flat][data-mode=onLight]:active:not(._no-active), [tuiWrapper][data-appearance=destructive][data-mode=onLight]:active:not(._no-active), [tuiWrapper][data-appearance=secondary][data-mode=onLight][data-state=active], [tuiWrapper][data-appearance=flat][data-mode=onLight][data-state=active], [tuiWrapper][data-appearance=destructive][data-mode=onLight][data-state=active], [tuiWrapper][data-appearance=secondary][data-mode=onLight][data-state=active]:hover, [tuiWrapper][data-appearance=flat][data-mode=onLight][data-state=active]:hover, [tuiWrapper][data-appearance=destructive][data-mode=onLight][data-state=active]:hover {
    background:var(--tui-clear-active)
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=secondary]:hover:not(._no-hover), [tuiWrapper][data-appearance=flat]:hover:not(._no-hover), [tuiWrapper][data-appearance=destructive]:hover:not(._no-hover), [tuiWrapper][data-appearance=secondary][data-state=hover], [tuiWrapper][data-appearance=flat][data-state=hover], [tuiWrapper][data-appearance=destructive][data-state=hover] {
        background:var(--tui-secondary-hover)
    }
}

[tuiWrapper][data-appearance=secondary]:active:not(._no-active), [tuiWrapper][data-appearance=flat]:active:not(._no-active), [tuiWrapper][data-appearance=destructive]:active:not(._no-active), [tuiWrapper][data-appearance=secondary][data-state=active], [tuiWrapper][data-appearance=flat][data-state=active], [tuiWrapper][data-appearance=destructive][data-state=active], [tuiWrapper][data-appearance=secondary][data-state=active]:hover, [tuiWrapper][data-appearance=flat][data-state=active]:hover, [tuiWrapper][data-appearance=destructive][data-state=active]:hover {
    background:var(--tui-secondary-active)
}

[tuiWrapper][data-appearance=secondary]:invalid:invalid, [tuiWrapper][data-appearance=flat]:invalid:invalid, [tuiWrapper][data-appearance=destructive]:invalid:invalid, [tuiWrapper][data-appearance=secondary]._invalid._invalid, [tuiWrapper][data-appearance=flat]._invalid._invalid, [tuiWrapper][data-appearance=destructive]._invalid._invalid {
    color: var(--tui-negative);
    background:var(--tui-error-bg)
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=secondary]:invalid:invalid:hover:not(._no-hover), [tuiWrapper][data-appearance=flat]:invalid:invalid:hover:not(._no-hover), [tuiWrapper][data-appearance=destructive]:invalid:invalid:hover:not(._no-hover), [tuiWrapper][data-appearance=secondary]._invalid._invalid:hover:not(._no-hover), [tuiWrapper][data-appearance=flat]._invalid._invalid:hover:not(._no-hover), [tuiWrapper][data-appearance=destructive]._invalid._invalid:hover:not(._no-hover), [tuiWrapper][data-appearance=secondary]:invalid:invalid[data-state=hover], [tuiWrapper][data-appearance=flat]:invalid:invalid[data-state=hover], [tuiWrapper][data-appearance=destructive]:invalid:invalid[data-state=hover], [tuiWrapper][data-appearance=secondary]._invalid._invalid[data-state=hover], [tuiWrapper][data-appearance=flat]._invalid._invalid[data-state=hover], [tuiWrapper][data-appearance=destructive]._invalid._invalid[data-state=hover] {
        background:var(--tui-error-bg-hover)
    }
}

:focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=secondary]:invalid:invalid, :focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=flat]:invalid:invalid, :focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=destructive]:invalid:invalid, :focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=secondary]._invalid._invalid, :focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=flat]._invalid._invalid, :focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=destructive]._invalid._invalid, [data-focused=true] > [tuiWrapper][data-appearance=secondary]:invalid:invalid, [data-focused=true] > [tuiWrapper][data-appearance=flat]:invalid:invalid, [data-focused=true] > [tuiWrapper][data-appearance=destructive]:invalid:invalid, [data-focused=true] > [tuiWrapper][data-appearance=secondary]._invalid._invalid, [data-focused=true] > [tuiWrapper][data-appearance=flat]._invalid._invalid, [data-focused=true] > [tuiWrapper][data-appearance=destructive]._invalid._invalid {
    --tui-focus: var(--tui-negative)
}

[tuiWrapper][data-appearance=secondary]:invalid:invalid:focus-visible:focus-visible, [tuiWrapper][data-appearance=flat]:invalid:invalid:focus-visible:focus-visible, [tuiWrapper][data-appearance=destructive]:invalid:invalid:focus-visible:focus-visible, [tuiWrapper][data-appearance=secondary]._invalid._invalid:focus-visible:focus-visible, [tuiWrapper][data-appearance=flat]._invalid._invalid:focus-visible:focus-visible, [tuiWrapper][data-appearance=destructive]._invalid._invalid:focus-visible:focus-visible {
    --tui-focus: var(--tui-negative)
}

[tuiWrapper][data-appearance=secondary]:invalid:invalid._focused._focused, [tuiWrapper][data-appearance=flat]:invalid:invalid._focused._focused, [tuiWrapper][data-appearance=destructive]:invalid:invalid._focused._focused, [tuiWrapper][data-appearance=secondary]._invalid._invalid._focused._focused, [tuiWrapper][data-appearance=flat]._invalid._invalid._focused._focused, [tuiWrapper][data-appearance=destructive]._invalid._invalid._focused._focused {
    --tui-focus: var(--tui-negative)
}

[tuiWrapper][data-appearance=flat], [tuiWrapper][data-appearance=flat][data-mode=onDark], [tuiWrapper][data-appearance=flat][data-mode=onLight] {
    background:transparent
}

[tuiWrapper][data-appearance=destructive] {
    color: var(--tui-negative);
    background:var(--tui-error-bg)
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=destructive]:hover:not(._no-hover), [tuiWrapper][data-appearance=destructive][data-state=hover] {
        background:var(--tui-error-bg-hover)
    }
}

[tuiWrapper][data-appearance=destructive]:active:not(._no-active), [tuiWrapper][data-appearance=destructive][data-state=active], [tuiWrapper][data-appearance=destructive][data-state=active]:hover {
    background:var(--tui-error-bg-hover)
}

[tuiWrapper][data-appearance=destructive][data-mode=onDark] {
    color: var(--tui-negative-night);
    background:var(--tui-error-bg-night)
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=destructive][data-mode=onDark]:hover:not(._no-hover), [tuiWrapper][data-appearance=destructive][data-mode=onDark][data-state=hover] {
        background:var(--tui-error-bg-night-hover)
    }
}

[tuiWrapper][data-appearance=destructive][data-mode=onDark]:active:not(._no-active), [tuiWrapper][data-appearance=destructive][data-mode=onDark][data-state=active], [tuiWrapper][data-appearance=destructive][data-mode=onDark][data-state=active]:hover {
    background:var(--tui-error-bg-night-hover)
}

tui-wrapper[data-appearance=secondary-destructive], [tuiWrapper][data-appearance=secondary-destructive] {
    background: var(--tui-error-bg);
    color:var(--tui-negative)
}

tui-wrapper[data-appearance=secondary-destructive][data-mode=onDark], [tuiWrapper][data-appearance=secondary-destructive][data-mode=onDark] {
    background: var(--tui-error-bg-night);
    color:var(--tui-negative-night)
}

@media (hover: hover) {
    tui-wrapper[data-appearance=secondary-destructive][data-mode=onDark]:hover:not(._no-hover), [tuiWrapper][data-appearance=secondary-destructive][data-mode=onDark]:hover:not(._no-hover), tui-wrapper[data-appearance=secondary-destructive][data-mode=onDark][data-state=hover], [tuiWrapper][data-appearance=secondary-destructive][data-mode=onDark][data-state=hover] {
        background:var(--tui-error-bg-night-hover)
    }
}

tui-wrapper[data-appearance=secondary-destructive][data-mode=onDark]:active:not(._no-active), [tuiWrapper][data-appearance=secondary-destructive][data-mode=onDark]:active:not(._no-active), tui-wrapper[data-appearance=secondary-destructive][data-mode=onDark][data-state=active], [tuiWrapper][data-appearance=secondary-destructive][data-mode=onDark][data-state=active], tui-wrapper[data-appearance=secondary-destructive][data-mode=onDark][data-state=active]:hover, [tuiWrapper][data-appearance=secondary-destructive][data-mode=onDark][data-state=active]:hover {
    background:var(--tui-error-bg-night-hover)
}

@media (hover: hover) {
    tui-wrapper[data-appearance=secondary-destructive]:hover:not(._no-hover), [tuiWrapper][data-appearance=secondary-destructive]:hover:not(._no-hover), tui-wrapper[data-appearance=secondary-destructive][data-state=hover], [tuiWrapper][data-appearance=secondary-destructive][data-state=hover] {
        background:var(--tui-error-bg-hover)
    }
}

tui-wrapper[data-appearance=secondary-destructive]:active:not(._no-active), [tuiWrapper][data-appearance=secondary-destructive]:active:not(._no-active), tui-wrapper[data-appearance=secondary-destructive][data-state=active], [tuiWrapper][data-appearance=secondary-destructive][data-state=active], tui-wrapper[data-appearance=secondary-destructive][data-state=active]:hover, [tuiWrapper][data-appearance=secondary-destructive][data-state=active]:hover {
    background:var(--tui-error-bg-hover)
}

[tuiWrapper][data-appearance=table] {
    border-radius: 0;
    background: transparent;
    color:var(--tui-text-01)
}

[tuiWrapper][data-appearance=table]:before, [tuiWrapper][data-appearance=table][data-appearance=table]:after {
    position: fixed;
    inset:-.5px -.5px -1px -1px
}

[tuiWrapper][data-appearance=table]:before {
    transition-property: background;
    transition-duration: var(--tui-duration, .3s);
    transition-timing-function: ease-in-out;
    content: "";
    z-index: -1;
    background-repeat: no-repeat;
    background-position: top right;
    background-size:.5rem .5rem
}

table [tuiWrapper][data-appearance=table][data-appearance=table]:not(._focused):after {
    border-width:0
}

table [tuiWrapper][data-appearance=table]._focused {
    z-index:1
}

[tuiWrapper][data-appearance=table][data-appearance=table]:after {
    border-width: 1px;
    color:var(--tui-base-04)
}

:focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=table][data-mode=onDark], [data-focused=true] > [tuiWrapper][data-appearance=table][data-mode=onDark] {
    --tui-focus: var(--tui-text-01-night)
}

[tuiWrapper][data-appearance=table][data-mode=onDark]:focus-visible:focus-visible {
    --tui-focus: var(--tui-text-01-night)
}

[tuiWrapper][data-appearance=table][data-mode=onDark]._focused._focused {
    --tui-focus: var(--tui-text-01-night)
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=table]:hover:not(._no-hover):not(._focused):before, [tuiWrapper][data-appearance=table][data-state=hover]:not(._focused):before {
        background-color:var(--tui-clear)
    }
}

:focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=table], [data-focused=true] > [tuiWrapper][data-appearance=table] {
    background:transparent
}

[tuiWrapper][data-appearance=table]:focus-visible:focus-visible {
    background:transparent
}

[tuiWrapper][data-appearance=table]._focused._focused {
    background:transparent
}

[tuiWrapper][data-appearance=table]:invalid:invalid:before, [tuiWrapper][data-appearance=table]._invalid._invalid:before {
    background-image:linear-gradient(to top right, transparent 0%, transparent 50%, var(--tui-error-fill) 50%, var(--tui-error-fill) 100%)
}

[tuiWrapper][data-appearance=table]:invalid:invalid:not(._focused):before, [tuiWrapper][data-appearance=table]._invalid._invalid:not(._focused):before {
    background-color:var(--tui-error-bg)
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=table]:invalid:invalid:hover:not(._no-hover):not(._focused):before, [tuiWrapper][data-appearance=table]._invalid._invalid:hover:not(._no-hover):not(._focused):before, [tuiWrapper][data-appearance=table]:invalid:invalid[data-state=hover]:not(._focused):before, [tuiWrapper][data-appearance=table]._invalid._invalid[data-state=hover]:not(._focused):before {
        background-color:var(--tui-error-bg-hover)
    }
}

[tuiWrapper][data-appearance=table]:invalid:invalid:disabled:disabled, [tuiWrapper][data-appearance=table]._invalid._invalid:disabled:disabled, [tuiWrapper][data-appearance=table]:invalid:invalid[data-state=disabled][data-state=disabled], [tuiWrapper][data-appearance=table]._invalid._invalid[data-state=disabled][data-state=disabled] {
    background:transparent
}

:focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=table]:invalid:invalid, :focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=table]._invalid._invalid, [data-focused=true] > [tuiWrapper][data-appearance=table]:invalid:invalid, [data-focused=true] > [tuiWrapper][data-appearance=table]._invalid._invalid {
    background: transparent;
    --tui-focus: var(--tui-error-fill)
}

:focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=table]:invalid:invalid:after, :focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=table]._invalid._invalid:after, [data-focused=true] > [tuiWrapper][data-appearance=table]:invalid:invalid:after, [data-focused=true] > [tuiWrapper][data-appearance=table]._invalid._invalid:after {
    border-width:1px
}

[tuiWrapper][data-appearance=table]:invalid:invalid:focus-visible:focus-visible, [tuiWrapper][data-appearance=table]._invalid._invalid:focus-visible:focus-visible {
    background: transparent;
    --tui-focus: var(--tui-error-fill)
}

[tuiWrapper][data-appearance=table]:invalid:invalid:focus-visible:focus-visible:after, [tuiWrapper][data-appearance=table]._invalid._invalid:focus-visible:focus-visible:after {
    border-width:1px
}

[tuiWrapper][data-appearance=table]:invalid:invalid._focused._focused, [tuiWrapper][data-appearance=table]._invalid._invalid._focused._focused {
    background: transparent;
    --tui-focus: var(--tui-error-fill)
}

[tuiWrapper][data-appearance=table]:invalid:invalid._focused._focused:after, [tuiWrapper][data-appearance=table]._invalid._invalid._focused._focused:after {
    border-width:1px
}

[tuiWrapper][data-appearance=textfield] {
    transition-property: box-shadow, background;
    transition-duration: var(--tui-duration, .3s);
    transition-timing-function: ease-in-out;
    background: var(--tui-base-01);
    color: var(--tui-text-01);
    box-shadow:0 .125rem .1875rem #0000001a
}

[tuiWrapper][data-appearance=textfield][data-appearance=textfield]:after {
    transition-property: color;
    transition-duration: var(--tui-duration, .3s);
    transition-timing-function: ease-in-out;
    color:var(--tui-base-03)
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=textfield]:hover:not(._no-hover), [tuiWrapper][data-appearance=textfield][data-state=hover] {
        box-shadow:0 .125rem .3125rem #00000029
    }
}

:focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=textfield], [data-focused=true] > [tuiWrapper][data-appearance=textfield] {
    box-shadow:none
}

:focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=textfield]:after, [data-focused=true] > [tuiWrapper][data-appearance=textfield]:after {
    --tui-focus: var(--tui-primary)
}

[tuiWrapper][data-appearance=textfield]:focus-visible:focus-visible {
    box-shadow:none
}

[tuiWrapper][data-appearance=textfield]:focus-visible:focus-visible:after {
    --tui-focus: var(--tui-primary)
}

[tuiWrapper][data-appearance=textfield]._focused._focused {
    box-shadow:none
}

[tuiWrapper][data-appearance=textfield]._focused._focused:after {
    --tui-focus: var(--tui-primary)
}

[tuiWrapper][data-appearance=textfield][data-state=readonly][data-state=readonly] {
    box-shadow:none
}

[tuiWrapper][data-appearance=textfield][data-state=readonly][data-state=readonly]:after {
    color:var(--tui-base-04)
}

[tuiWrapper][data-appearance=textfield]:disabled:disabled, [tuiWrapper][data-appearance=textfield][data-state=disabled][data-state=disabled] {
    box-shadow:none
}

[tuiWrapper][data-appearance=textfield]:invalid:invalid:after, [tuiWrapper][data-appearance=textfield]._invalid._invalid:after {
    color: var(--tui-error-fill);
    --tui-focus: var(--tui-error-fill)
}

[tuiWrapper][data-appearance=textfield][data-mode=onDark] {
    background: var(--tui-clear-inverse);
    color:var(--tui-text-01-night)
}

[tuiWrapper][data-appearance=textfield][data-mode=onDark]:after {
    color: var(--tui-text-03-night);
    opacity:var(--tui-disabled-opacity)
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=textfield][data-mode=onDark]:hover:not(._no-hover), [tuiWrapper][data-appearance=textfield][data-mode=onDark][data-state=hover] {
        background:var(--tui-clear-inverse-hover)
    }
}

[tuiWrapper][data-appearance=textfield][data-mode=onDark][data-state=readonly][data-state=readonly] {
    background:transparent
}

:focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=textfield][data-mode=onDark], [data-focused=true] > [tuiWrapper][data-appearance=textfield][data-mode=onDark] {
    background:#ffffff14
}

:focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=textfield][data-mode=onDark]:after, [data-focused=true] > [tuiWrapper][data-appearance=textfield][data-mode=onDark]:after {
    transition: none;
    opacity: 1;
    --tui-focus: var(--tui-primary)
}

[tuiWrapper][data-appearance=textfield][data-mode=onDark]:focus-visible:focus-visible {
    background:#ffffff14
}

[tuiWrapper][data-appearance=textfield][data-mode=onDark]:focus-visible:focus-visible:after {
    transition: none;
    opacity: 1;
    --tui-focus: var(--tui-primary)
}

[tuiWrapper][data-appearance=textfield][data-mode=onDark]._focused._focused {
    background:#ffffff14
}

[tuiWrapper][data-appearance=textfield][data-mode=onDark]._focused._focused:after {
    transition: none;
    opacity: 1;
    --tui-focus: var(--tui-primary)
}

[tuiWrapper][data-appearance=textfield][data-mode=onDark]:invalid:invalid:after, [tuiWrapper][data-appearance=textfield][data-mode=onDark]._invalid._invalid:after {
    --tui-focus: var(--tui-error-fill-night)
}

[tuiWrapper][data-appearance=textfield][data-mode=onLight] {
    background:var(--tui-clear)
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=textfield][data-mode=onLight]:hover:not(._no-hover), [tuiWrapper][data-appearance=textfield][data-mode=onLight][data-state=hover] {
        background:var(--tui-clear-hover)
    }
}

[tuiWrapper][data-appearance=textfield][data-mode=onLight][data-state=readonly][data-state=readonly] {
    background:transparent
}

[tuiWrapper][data-appearance=textfield][data-mode=onLight]:invalid:invalid:after, [tuiWrapper][data-appearance=textfield][data-mode=onLight]._invalid._invalid:after {
    color:var(--tui-error-fill)
}

:focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=textfield][data-mode=onLight], [data-focused=true] > [tuiWrapper][data-appearance=textfield][data-mode=onLight] {
    background:transparent
}

[tuiWrapper][data-appearance=textfield][data-mode=onLight]:focus-visible:focus-visible {
    background:transparent
}

[tuiWrapper][data-appearance=textfield][data-mode=onLight]._focused._focused {
    background:transparent
}

[tuiWrapper][data-appearance=whiteblock], [tuiWrapper][data-appearance=whiteblock-active] {
    background: var(--tui-base-01);
    color:var(--tui-text-01)
}

[tuiWrapper][data-appearance=whiteblock]:after, [tuiWrapper][data-appearance=whiteblock-active]:after {
    color:var(--tui-base-04)
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=whiteblock]:hover:not(._no-hover), [tuiWrapper][data-appearance=whiteblock-active]:hover:not(._no-hover), [tuiWrapper][data-appearance=whiteblock][data-state=hover], [tuiWrapper][data-appearance=whiteblock-active][data-state=hover] {
        background:var(--tui-base-02)
    }

    [tuiWrapper][data-appearance=whiteblock]:hover:not(._no-hover):after, [tuiWrapper][data-appearance=whiteblock-active]:hover:not(._no-hover):after, [tuiWrapper][data-appearance=whiteblock][data-state=hover]:after, [tuiWrapper][data-appearance=whiteblock-active][data-state=hover]:after {
        color:var(--tui-base-04)
    }
}

[tuiWrapper][data-appearance=whiteblock]:active:not(._no-active), [tuiWrapper][data-appearance=whiteblock-active]:active:not(._no-active), [tuiWrapper][data-appearance=whiteblock][data-state=active], [tuiWrapper][data-appearance=whiteblock-active][data-state=active], [tuiWrapper][data-appearance=whiteblock][data-state=active]:hover, [tuiWrapper][data-appearance=whiteblock-active][data-state=active]:hover {
    background:var(--tui-base-02)
}

[tuiWrapper][data-appearance=whiteblock]:active:not(._no-active):after, [tuiWrapper][data-appearance=whiteblock-active]:active:not(._no-active):after, [tuiWrapper][data-appearance=whiteblock][data-state=active]:after, [tuiWrapper][data-appearance=whiteblock-active][data-state=active]:after, [tuiWrapper][data-appearance=whiteblock][data-state=active]:hover:after, [tuiWrapper][data-appearance=whiteblock-active][data-state=active]:hover:after {
    color:var(--tui-base-04)
}

[tuiWrapper][data-appearance=whiteblock-active]:after {
    color: var(--tui-primary);
    border-width:2px
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=whiteblock-active]:hover:not(._no-hover):after, [tuiWrapper][data-appearance=whiteblock-active][data-state=hover]:after {
        color:var(--tui-primary-hover)
    }
}

[tuiWrapper][data-appearance=whiteblock-active]:active:not(._no-active):after, [tuiWrapper][data-appearance=whiteblock-active][data-state=active]:after, [tuiWrapper][data-appearance=whiteblock-active][data-state=active]:hover:after {
    color:var(--tui-primary-active)
}

[tuiWrapper][data-appearance=none]:after {
    border:none
}

[tuiWrapper][data-appearance=opposite] {
    background: #000;
    color: #fff;
    --tui-focus: rgba(255, 255, 255, .64)
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=opposite]:hover:not(._no-hover), [tuiWrapper][data-appearance=opposite][data-state=hover] {
        background:#333
    }
}

[tuiWrapper][data-appearance=opposite]:active:not(._no-active), [tuiWrapper][data-appearance=opposite][data-state=active], [tuiWrapper][data-appearance=opposite][data-state=active]:hover {
    background:#5c636b
}

[tuiWrapper][data-appearance=opposite][data-mode=onDark] {
    color: #000c;
    background: #fff;
    --tui-focus: rgba(51, 51, 51, .48)
}

@media (hover: hover) {
    [tuiWrapper][data-appearance=opposite][data-mode=onDark]:hover:not(._no-hover), [tuiWrapper][data-appearance=opposite][data-mode=onDark][data-state=hover] {
        background:#f3f4f6
    }
}

[tuiWrapper][data-appearance=opposite][data-mode=onDark]:active:not(._no-active), [tuiWrapper][data-appearance=opposite][data-mode=onDark][data-state=active], [tuiWrapper][data-appearance=opposite][data-mode=onDark][data-state=active]:hover {
    background:#eaecee
}

[tuiWrapper] {
    transition-property: color, background, opacity;
    transition-duration: var(--tui-duration, .3s);
    transition-timing-function: ease-in-out;
    position: relative;
    display: block;
    height: 100%;
    width: 100%;
    appearance: none;
    border-radius:inherit
}

[tuiWrapper]:after {
    transition-property: box-shadow, color;
    transition-duration: var(--tui-duration, .3s);
    transition-timing-function: ease-in-out;
    position: absolute;
    inset: 0;
    content: "";
    border-radius: inherit;
    border: 1px solid currentColor;
    pointer-events: none;
    color:transparent
}

:focus-visible:not([data-focused=false]) > [tuiWrapper]:after, [data-focused=true] > [tuiWrapper]:after {
    border-width: 2px;
    color:var(--tui-focus)
}

[tuiWrapper]:focus-visible:focus-visible:after {
    border-width: 2px;
    color:var(--tui-focus)
}

[tuiWrapper]._focused._focused:after {
    border-width: 2px;
    color:var(--tui-focus)
}

[tuiWrapper]:disabled:disabled, [tuiWrapper][data-state=disabled][data-state=disabled] {
    pointer-events: none;
    opacity:var(--tui-disabled-opacity)
}

@supports (-webkit-hyphens: none) {
    :focus-visible [tuiWrapper], [tuiWrapper]:focus-visible {
        --tui-focus: transparent !important
    }
}

tui-wrapper[data-appearance=mono], [tuiWrapper][data-appearance=mono] {
    background: var(--tui-base-01);
    color:var(--tui-text-01)
}

@media (hover: hover) {
    tui-wrapper[data-appearance=mono]:hover:not(._no-hover), [tuiWrapper][data-appearance=mono]:hover:not(._no-hover), tui-wrapper[data-appearance=mono][data-state=hover], [tuiWrapper][data-appearance=mono][data-state=hover] {
        color:var(--tui-text-03)
    }
}

tui-wrapper[data-appearance=mono]:active:not(._no-active), [tuiWrapper][data-appearance=mono]:active:not(._no-active), tui-wrapper[data-appearance=mono][data-state=active], [tuiWrapper][data-appearance=mono][data-state=active], tui-wrapper[data-appearance=mono][data-state=active]:hover, [tuiWrapper][data-appearance=mono][data-state=active]:hover {
    color:var(--tui-text-02)
}

:focus-visible:not([data-focused=false]) > tui-wrapper[data-appearance=mono][data-mode=onDark], :focus-visible:not([data-focused=false]) > [tuiWrapper][data-appearance=mono][data-mode=onDark], [data-focused=true] > tui-wrapper[data-appearance=mono][data-mode=onDark], [data-focused=true] > [tuiWrapper][data-appearance=mono][data-mode=onDark] {
    --tui-focus: var(--tui-text-01-night)
}

tui-wrapper[data-appearance=mono][data-mode=onDark]:focus-visible:focus-visible, [tuiWrapper][data-appearance=mono][data-mode=onDark]:focus-visible:focus-visible {
    --tui-focus: var(--tui-text-01-night)
}

tui-wrapper[data-appearance=mono][data-mode=onDark]._focused._focused, [tuiWrapper][data-appearance=mono][data-mode=onDark]._focused._focused {
    --tui-focus: var(--tui-text-01-night)
}

tui-primitive-calendar [data-type=weekday] {
    color:var(--tui-text-01)
}

tui-primitive-calendar [data-type=weekend] {
    color:var(--tui-negative)
}

@keyframes tuiReveal {
    0% {
        transform:scale(0)
    }

    to {
        transform:scale(1)
    }
}

@keyframes tuiFadeIn {
    0% {
        opacity:0
    }

    to {
        opacity:1
    }
}

html {
    height: 100%;
    font-size:16px
}

body {
    height: 100%;
    min-height: 100%;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing:grayscale
}

html, body {
    -webkit-overflow-scrolling:touch
}

ul, ol {
    list-style: none;
    padding: 0;
    margin:0
}

table {
    border-collapse: collapse;
    border-spacing:0
}

input, button, select, textarea {
    font-family: inherit;
    color:inherit
}

hr {
    margin: 0;
    height: 1px;
    border: none;
    background:var(--tui-base-03)
}

iframe {
    border:none
}

svg use {
    pointer-events:none
}

::selection {
    background-color:var(--tui-selection)
}

::-ms-clear {
    display:none
}

::-ms-reveal {
    display:none
}

@supports (-webkit-hyphens: none) and(text-align-last: right) {
    :after {
        content:none
    }
}

.tui-container {
    margin-right: auto;
    margin-left:auto
}

@media screen and (min-width: 80em) {
    .tui-container.tui-container_adaptive {
        width:69rem
    }
}

@media screen and (max-width: 79.9625em) {
    .tui-container.tui-container_adaptive {
        width:51.5rem
    }
}

@media screen and (max-width: 47.9625em) {
    .tui-container.tui-container_adaptive {
        width: 100%;
        padding: 0 1rem;
        box-sizing:border-box
    }
}

@media screen and (min-width: 80em) {
    .tui-container {
        width:69rem
    }
}

@media screen and (max-width: 79.9625em) {
    .tui-container {
        width: 51.5rem;
        padding:0 3rem
    }
}

@media screen and (min-width: 80em) {
    .tui-container_menu {
        width:69rem
    }
}

@media (min-width: 64em) and(max-width: 79.9625em) {
    .tui-container_menu {
        width:51.5rem
    }
}

@media screen and (max-width: 47.9625em) {
    .tui-container_menu {
        width: auto;
        padding: 0 1rem;
        box-sizing:border-box
    }
}

.tui-container_fullwidth {
    width: auto;
    padding:0 1.5rem
}

@media screen and (max-width: 47.9625em) {
    .tui-container_fullwidth {
        padding: 0 1rem;
        box-sizing:border-box
    }
}

@media screen and (max-width: 79.9625em) {
    .tui-container_fixed {
        width:69rem
    }
}

.tui-form__header {
    font: var(--tui-font-heading-5);
    margin-top: 2rem;
    margin-bottom:1.25rem
}

@media screen and (max-width: 47.9625em) {
    .tui-form__header {
        font: var(--tui-font-text-l);
        font-weight: 700;
        margin-bottom:1rem
    }
}

.tui-form__header_margin-top_none {
    margin-top:0
}

.tui-form__header_margin-bottom_none {
    margin-bottom:0
}

.tui-form__header_margin-bottom_small {
    margin-bottom:1rem
}

@media screen and (max-width: 47.9625em) {
    .tui-form__header_margin-bottom_small {
        margin-bottom:.75rem
    }
}

.tui-form__row {
    margin-top:1.25rem
}

.tui-form__row:first-child {
    margin-top:0
}

.tui-form__row_multi-fields {
    display:flex
}

@media screen and (max-width: 47.9625em) {
    .tui-form__row_multi-fields {
        flex-wrap:wrap
    }
}

.tui-form__row_half-width {
    width:calc(50% - .625rem)
}

@media screen and (max-width: 47.9625em) {
    .tui-form__row_half-width {
        width:100%
    }
}

.tui-form__row_checkboxes {
    display: flex;
    flex-wrap:wrap
}

@media screen and (max-width: 47.9625em) {
    .tui-form__row {
        margin-top:1rem
    }
}

.tui-form__multi-field {
    flex: 1 1 0;
    min-width: 0;
    margin-left:1.25rem
}

.tui-form__multi-field:first-child {
    margin-left:0
}

@media screen and (max-width: 47.9625em) {
    .tui-form__multi-field {
        flex-basis: 100%;
        margin-top: 1rem;
        margin-left:0
    }

    .tui-form__multi-field:first-child {
        margin-top:0
    }
}

.tui-form__field-note {
    font: var(--tui-font-text-s);
    margin-top: .25rem;
    color:var(--tui-text-02)
}

.tui-form__field-checkbox {
    margin-top:.5rem
}

.tui-form__checkbox {
    flex:1 1 calc(50% - .625rem)
}

.tui-form__checkbox:nth-child(2n) {
    margin-left:1.25rem
}

.tui-form__checkbox:nth-child(n + 3) {
    margin-top:1rem
}

.tui-form__buttons {
    display: flex;
    margin-top:2rem
}

.tui-form__buttons_align_end {
    justify-content:flex-end
}

.tui-form__buttons_align_center {
    justify-content:center
}

@media screen and (max-width: 47.9625em) {
    .tui-form__buttons {
        flex-direction: column;
        margin-top:1.5rem
    }
}

.tui-form__button {
    margin-left:.75rem
}

.tui-form__button:first-child {
    margin-left:0
}

@media screen and (max-width: 47.9625em) {
    .tui-form__button {
        margin-top: .5rem;
        margin-left:0
    }
}

.tui-island {
    position: relative;
    border-radius: var(--tui-radius-xl);
    background-color: var(--tui-base-01);
    word-wrap: break-word;
    text-decoration: none;
    color: var(--tui-text-01);
    outline: none;
    box-sizing:content-box
}

.tui-island:not(.tui-island_hoverable):before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    box-sizing: border-box;
    border: 1px solid var(--tui-base-03);
    border-radius: inherit;
    pointer-events:none
}

.tui-island:focus:before, .tui-island:hover:focus:before {
    border-color:var(--tui-focus)
}

.tui-island_hoverable {
    box-shadow: var(--tui-shadow);
    transition-property: all;
    transition-duration: var(--tui-duration, .3s);
    transition-timing-function: ease-in-out;
    cursor: pointer;
    transition-property: transform, box-shadow;
    will-change: transform, box-shadow;
    background:var(--tui-elevation-02)
}

.tui-island_hoverable:hover {
    box-shadow: var(--tui-shadow-hover);
    transform:translateY(-.25rem)
}

.tui-island_transparent {
    background-color:transparent
}

.tui-island_size_s {
    --tui-radius-xl: calc(4 * var(--tui-radius-l) / 3);
    font: var(--tui-font-text-s);
    padding:1rem
}

.tui-island_size_m {
    --tui-radius-xl: calc(5 * var(--tui-radius-l) / 3);
    font: var(--tui-font-text-m);
    padding:1rem
}

.tui-island_size_l {
    font: var(--tui-font-text-m);
    padding:1.25rem
}

.tui-island_text-align_left {
    text-align:left
}

.tui-island_text-align_center {
    text-align:center
}

.tui-island_text-align_right {
    text-align:right
}

.tui-island__content {
    display: flex;
    justify-content:space-between
}

.tui-island_text-align_center .tui-island__content {
    display:block
}

.tui-island__content > * {
    min-width:0
}

.tui-island__category {
    font-size: .6875rem;
    line-height: 1rem;
    text-transform: uppercase;
    letter-spacing: .075em;
    margin: 0 0 .5rem;
    color:var(--tui-text-02)
}

.tui-island_size_l .tui-island__category {
    margin:0 0 .75rem
}

.tui-island__title {
    font: var(--tui-font-text-m);
    margin:0 0 .5rem
}

.tui-island_size_m .tui-island__title {
    font: var(--tui-font-heading-6);
    margin:0 0 .75rem
}

.tui-island_size_l .tui-island__title {
    font:var(--tui-font-heading-6)
}

.tui-island__paragraph {
    margin: 0;
    color:var(--tui-text-02)
}

.tui-island__paragraph_link.tui-island__paragraph {
    margin-top:1rem
}

.tui-island_size_l .tui-island__paragraph_link.tui-island__paragraph {
    margin:1rem 0 0
}

.tui-island__paragraph_button.tui-island__paragraph {
    margin-top:1.25rem
}

.tui-island_size_l .tui-island__paragraph_button.tui-island__paragraph {
    margin:1.25rem 0 0
}

.tui-island__figure {
    display: flex;
    justify-content: center;
    order: 1;
    flex-shrink: 0;
    margin:0 0 0 1rem
}

.tui-island_size_l .tui-island__figure {
    margin-left:2.25rem
}

.tui-island_text-align_center .tui-island__figure {
    margin:0 0 .75rem
}

.tui-island__carousel-controls {
    display: flex;
    padding-bottom: 1rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid var(--tui-base-03);
    white-space:nowrap
}

.tui-island__carousel-pages {
    margin-left: auto;
    color:var(--tui-text-02)
}

.tui-island__carousel-button {
    margin-right:.5rem
}

.tui-island .tui-island__footer-button {
    display: block;
    width: calc(100% + 1.875rem);
    margin: 1rem calc(-1rem + 1px) calc(-1rem + 1px);
    border-top: 1px solid var(--tui-base-03);
    border-radius:0 0 var(--tui-radius-xl) var(--tui-radius-xl)
}

.tui-island_size_l .tui-island__footer-button {
    width: calc(100% + 2.375rem);
    margin:1.25rem calc(-1.25rem + 1px) calc(-1.25rem + 1px)
}

.tui-island__marker:first-child:not(:only-child) {
    margin-right:1.25rem
}

.tui-island__marker:not(:first-child), .tui-island__marker:only-child {
    margin-left:1.25rem
}

.tui-list {
    font: var(--tui-font-text-m);
    line-height: 1.5rem;
    list-style-type: none;
    color:var(--tui-text-01)
}

.tui-list_large {
    font: var(--tui-font-text-l);
    line-height:1.75rem
}

.tui-list_small, .tui-list_extra-small {
    font: var(--tui-font-text-s);
    line-height:1.25rem
}

.tui-list_nested {
    margin: .75rem 0 .75rem 1.25rem;
    color:var(--tui-text-02)
}

.tui-list_large .tui-list_nested {
    margin-left:.75rem
}

.tui-list_small .tui-list_nested {
    margin-top: .5rem;
    margin-bottom:.5rem
}

.tui-list_ordered {
    counter-reset:counter
}

.tui-list__item {
    position: relative;
    padding-left: 1.5rem;
    word-wrap: break-word;
    margin-top:.75rem
}

.tui-list__item:first-child {
    margin-top:0
}

.tui-list__item:before {
    content: "";
    position: absolute;
    left: 0;
    top: .5rem;
    width: .5rem;
    height: .5rem;
    border-radius: 100%;
    background-color:var(--tui-primary)
}

.tui-list_large > .tui-list__item:before {
    top:.625rem
}

.tui-list_small > .tui-list__item:before {
    top:.325rem
}

.tui-list_extra-small > .tui-list__item {
    margin-top:.5rem
}

.tui-list_linear .tui-list__item {
    padding-left:1.75rem
}

.tui-list_linear .tui-list__item:before {
    content: "\2014";
    left: 0;
    top: auto;
    width: auto;
    height: auto;
    background-color:transparent
}

.tui-list_ordered .tui-list__item {
    padding-left:1.25rem
}

.tui-list_ordered .tui-list__item:before {
    content: counter(counter) ".";
    left: 0;
    top: auto;
    counter-increment: counter;
    width: auto;
    height: auto;
    color: var(--tui-text-03);
    background-color:transparent
}

.tui-list_triangle > .tui-list__item {
    padding-left:1.75rem
}

.tui-list_triangle > .tui-list__item:before {
    content: "\25e4";
    left: 0;
    top: 1px;
    width: auto;
    height: auto;
    background-color: transparent;
    color: var(--tui-base-06);
    font-size:.75rem
}

.tui-list__item-title {
    font: var(--tui-font-heading-5);
    margin:0
}

.tui-list_small .tui-list__item-title {
    line-height: 1.25rem;
    font-weight:700
}

.tui-list__description {
    margin: .5rem 0 0;
    color:var(--tui-text-02)
}

.tui-list_small .tui-list__description {
    margin-top:.25rem
}

.tui-list_large .tui-list__description {
    line-height: 1.75rem;
    margin-top:.75rem
}

@media not screen and (max-width: 47.9625em) {
    .tui-mobile-only {
        display:none !important
    }
}

.tui-required:after {
    content: "*"
}

.tui-required_float:after {
    position:absolute
}

.tui-required_spacing:after {
    content: "\a0*"
}

.tui-row {
    display: flex;
    flex-wrap:wrap
}

.tui-row_align_center {
    align-items:center
}

.tui-row_align_start {
    align-items:flex-start
}

.tui-row_align_end {
    align-items:flex-end
}

@media screen and (min-width: 80em) {
    .tui-row_adaptive.tui-row {
        margin-left: -2.5rem;
        margin-right:-2.5rem
    }
}

@media screen and (max-width: 79.9625em) {
    .tui-row_adaptive.tui-row {
        margin-left: -2.5rem;
        margin-right:-2.5rem
    }
}

@media screen and (max-width: 47.9625em) {
    .tui-row_adaptive.tui-row {
        margin-left: -1.25rem;
        margin-right:-1.25rem
    }
}

.tui-row_temporary.tui-row {
    margin-left: -2.5rem;
    margin-right:-2.5rem
}

@media screen and (min-width: 80em) {
    .tui-row {
        margin-left: -2.5rem;
        margin-right:-2.5rem
    }
}

@media screen and (max-width: 79.9625em) {
    .tui-row {
        margin-left: -2.5rem;
        margin-right:-2.5rem
    }
}

.tui-col_1 {
    width: 8.33333333%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-col_2 {
    width: 16.66666667%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-col_3 {
    width: 25%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-col_4 {
    width: 33.33333333%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-col_5 {
    width: 41.66666667%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-col_6 {
    width: 50%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-col_7 {
    width: 58.33333333%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-col_8 {
    width: 66.66666667%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-col_9 {
    width: 75%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-col_10 {
    width: 83.33333333%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-col_11 {
    width: 91.66666667%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-col_12 {
    width: 100%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-col_md-1 {
    width: 8.33333333%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-col_md-2 {
    width: 16.66666667%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-col_md-3 {
    width: 25%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-col_md-4 {
    width: 33.33333333%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-col_md-5 {
    width: 41.66666667%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-col_md-6 {
    width: 50%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-col_md-7 {
    width: 58.33333333%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-col_md-8 {
    width: 66.66666667%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-col_md-9 {
    width: 75%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-col_md-10 {
    width: 83.33333333%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-col_md-11 {
    width: 91.66666667%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-col_md-12 {
    width: 100%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-col_stretch {
    display:flex
}

@media screen and (min-width: 80em) {
    .tui-row_adaptive .tui-col_lg-1 {
        width: 8.33333333%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_lg-2 {
        width: 16.66666667%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_lg-3 {
        width: 25%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_lg-4 {
        width: 33.33333333%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_lg-5 {
        width: 41.66666667%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_lg-6 {
        width: 50%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_lg-7 {
        width: 58.33333333%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_lg-8 {
        width: 66.66666667%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_lg-9 {
        width: 75%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_lg-10 {
        width: 83.33333333%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_lg-11 {
        width: 91.66666667%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_lg-12 {
        width: 100%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }
}

@media screen and (max-width: 79.9625em) {
    .tui-row_adaptive .tui-col_md-1 {
        width: 8.33333333%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_md-2 {
        width: 16.66666667%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_md-3 {
        width: 25%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_md-4 {
        width: 33.33333333%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_md-5 {
        width: 41.66666667%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_md-6 {
        width: 50%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_md-7 {
        width: 58.33333333%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_md-8 {
        width: 66.66666667%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_md-9 {
        width: 75%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_md-10 {
        width: 83.33333333%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_md-11 {
        width: 91.66666667%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_md-12 {
        width: 100%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }
}

@media screen and (max-width: 47.9625em) {
    .tui-row_adaptive .tui-col_xs-1 {
        width: 8.33333333%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_xs-2 {
        width: 16.66666667%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_xs-3 {
        width: 25%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_xs-4 {
        width: 33.33333333%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_xs-5 {
        width: 41.66666667%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_xs-6 {
        width: 50%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_xs-7 {
        width: 58.33333333%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_xs-8 {
        width: 66.66666667%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_xs-9 {
        width: 75%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_xs-10 {
        width: 83.33333333%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_xs-11 {
        width: 91.66666667%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing:border-box
    }

    .tui-row_adaptive .tui-col_xs-12 {
        width: 100%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing:border-box
    }
}

.tui-row_temporary .tui-col_1 {
    width: 8.33333333%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-row_temporary .tui-col_2 {
    width: 16.66666667%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-row_temporary .tui-col_3 {
    width: 25%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-row_temporary .tui-col_4 {
    width: 33.33333333%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-row_temporary .tui-col_5 {
    width: 41.66666667%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-row_temporary .tui-col_6 {
    width: 50%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-row_temporary .tui-col_7 {
    width: 58.33333333%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-row_temporary .tui-col_8 {
    width: 66.66666667%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-row_temporary .tui-col_9 {
    width: 75%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-row_temporary .tui-col_10 {
    width: 83.33333333%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-row_temporary .tui-col_11 {
    width: 91.66666667%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

.tui-row_temporary .tui-col_12 {
    width: 100%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    box-sizing:border-box
}

@media screen and (min-width: 80em) {
    .tui-col_1 {
        width: 8.33333333%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-col_2 {
        width: 16.66666667%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-col_3 {
        width: 25%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-col_4 {
        width: 33.33333333%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-col_5 {
        width: 41.66666667%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-col_6 {
        width: 50%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-col_7 {
        width: 58.33333333%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-col_8 {
        width: 66.66666667%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-col_9 {
        width: 75%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-col_10 {
        width: 83.33333333%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-col_11 {
        width: 91.66666667%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .tui-col_12 {
        width: 100%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }
}

.tui-col-offset_1 {
    margin-left:8.33333333%
}

.tui-col-offset_2 {
    margin-left:16.66666667%
}

.tui-col-offset_3 {
    margin-left:25%
}

.tui-col-offset_4 {
    margin-left:33.33333333%
}

.tui-col-offset_5 {
    margin-left:41.66666667%
}

.tui-col-offset_6 {
    margin-left:50%
}

.tui-col-offset_7 {
    margin-left:58.33333333%
}

.tui-col-offset_8 {
    margin-left:66.66666667%
}

.tui-col-offset_9 {
    margin-left:75%
}

.tui-col-offset_10 {
    margin-left:83.33333333%
}

.tui-col-offset_11 {
    margin-left:91.66666667%
}

.tui-col-offset_12 {
    margin-left:100%
}

@media (min-width: 22.5em) and(max-width: 47.9625em) {
    .tui-col-offset_xs-1 {
        margin-left:8.33333333%
    }

    .tui-col-offset_xs-2 {
        margin-left:16.66666667%
    }

    .tui-col-offset_xs-3 {
        margin-left:25%
    }

    .tui-col-offset_xs-4 {
        margin-left:33.33333333%
    }

    .tui-col-offset_xs-5 {
        margin-left:41.66666667%
    }

    .tui-col-offset_xs-6 {
        margin-left:50%
    }

    .tui-col-offset_xs-7 {
        margin-left:58.33333333%
    }

    .tui-col-offset_xs-8 {
        margin-left:66.66666667%
    }

    .tui-col-offset_xs-9 {
        margin-left:75%
    }

    .tui-col-offset_xs-10 {
        margin-left:83.33333333%
    }

    .tui-col-offset_xs-11 {
        margin-left:91.66666667%
    }

    .tui-col-offset_xs-12 {
        margin-left:100%
    }
}

@media screen and (max-width: 79.9625em) {
    .tui-col-offset_md-1 {
        margin-left:8.33333333%
    }

    .tui-col-offset_md-2 {
        margin-left:16.66666667%
    }

    .tui-col-offset_md-3 {
        margin-left:25%
    }

    .tui-col-offset_md-4 {
        margin-left:33.33333333%
    }

    .tui-col-offset_md-5 {
        margin-left:41.66666667%
    }

    .tui-col-offset_md-6 {
        margin-left:50%
    }

    .tui-col-offset_md-7 {
        margin-left:58.33333333%
    }

    .tui-col-offset_md-8 {
        margin-left:66.66666667%
    }

    .tui-col-offset_md-9 {
        margin-left:75%
    }

    .tui-col-offset_md-10 {
        margin-left:83.33333333%
    }

    .tui-col-offset_md-11 {
        margin-left:91.66666667%
    }

    .tui-col-offset_md-12 {
        margin-left:100%
    }
}

@media screen and (min-width: 80em) {
    .tui-col-offset_lg-1 {
        margin-left:8.33333333%
    }

    .tui-col-offset_lg-2 {
        margin-left:16.66666667%
    }

    .tui-col-offset_lg-3 {
        margin-left:25%
    }

    .tui-col-offset_lg-4 {
        margin-left:33.33333333%
    }

    .tui-col-offset_lg-5 {
        margin-left:41.66666667%
    }

    .tui-col-offset_lg-6 {
        margin-left:50%
    }

    .tui-col-offset_lg-7 {
        margin-left:58.33333333%
    }

    .tui-col-offset_lg-8 {
        margin-left:66.66666667%
    }

    .tui-col-offset_lg-9 {
        margin-left:75%
    }

    .tui-col-offset_lg-10 {
        margin-left:83.33333333%
    }

    .tui-col-offset_lg-11 {
        margin-left:91.66666667%
    }

    .tui-col-offset_lg-12 {
        margin-left:100%
    }
}

.tui-skeleton {
    position: relative;
    color: transparent !important;
    background: transparent !important;
    pointer-events: none;
    -webkit-user-select: none;
    user-select:none
}

.tui-skeleton:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    background-color: var(--tui-clear-hover);
    animation: tuiSkeletonVibe ease-in-out 1s infinite alternate;
    border-radius:var(--tui-skeleton-radius, 0)
}

.tui-skeleton_light:after {
    background-color:#ffffff3d
}

.tui-skeleton_rounded:after {
    border-radius:inherit
}

.tui-skeleton_short:after {
    width:40%
}

.tui-skeleton_center:after {
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    width:40%
}

.tui-skeleton_text:before {
    content: "\a0"
}

.tui-skeleton * {
    opacity: 0;
    visibility:hidden
}

.tui-space_all-16 {
    margin:4rem
}

.tui-space_all-15 {
    margin:3.75rem
}

.tui-space_all-14 {
    margin:3.5rem
}

.tui-space_all-13 {
    margin:3.25rem
}

.tui-space_all-12 {
    margin:3rem
}

.tui-space_all-11 {
    margin:2.75rem
}

.tui-space_all-10 {
    margin:2.5rem
}

.tui-space_all-9 {
    margin:2.25rem
}

.tui-space_all-8 {
    margin:2rem
}

.tui-space_all-7 {
    margin:1.75rem
}

.tui-space_all-6 {
    margin:1.5rem
}

.tui-space_all-5 {
    margin:1.25rem
}

.tui-space_all-4 {
    margin:1rem
}

.tui-space_all-3 {
    margin:.75rem
}

.tui-space_all-2 {
    margin:.5rem
}

.tui-space_all-1 {
    margin:.25rem
}

.tui-space_all-0 {
    margin:0rem
}

.tui-space_top-16 {
    margin-top:4rem
}

.tui-space_top-15 {
    margin-top:3.75rem
}

.tui-space_top-14 {
    margin-top:3.5rem
}

.tui-space_top-13 {
    margin-top:3.25rem
}

.tui-space_top-12 {
    margin-top:3rem
}

.tui-space_top-11 {
    margin-top:2.75rem
}

.tui-space_top-10 {
    margin-top:2.5rem
}

.tui-space_top-9 {
    margin-top:2.25rem
}

.tui-space_top-8 {
    margin-top:2rem
}

.tui-space_top-7 {
    margin-top:1.75rem
}

.tui-space_top-6 {
    margin-top:1.5rem
}

.tui-space_top-5 {
    margin-top:1.25rem
}

.tui-space_top-4 {
    margin-top:1rem
}

.tui-space_top-3 {
    margin-top:.75rem
}

.tui-space_top-2 {
    margin-top:.5rem
}

.tui-space_top-1 {
    margin-top:.25rem
}

.tui-space_top-0 {
    margin-top:0rem
}

.tui-space_bottom-16 {
    margin-bottom:4rem
}

.tui-space_bottom-15 {
    margin-bottom:3.75rem
}

.tui-space_bottom-14 {
    margin-bottom:3.5rem
}

.tui-space_bottom-13 {
    margin-bottom:3.25rem
}

.tui-space_bottom-12 {
    margin-bottom:3rem
}

.tui-space_bottom-11 {
    margin-bottom:2.75rem
}

.tui-space_bottom-10 {
    margin-bottom:2.5rem
}

.tui-space_bottom-9 {
    margin-bottom:2.25rem
}

.tui-space_bottom-8 {
    margin-bottom:2rem
}

.tui-space_bottom-7 {
    margin-bottom:1.75rem
}

.tui-space_bottom-6 {
    margin-bottom:1.5rem
}

.tui-space_bottom-5 {
    margin-bottom:1.25rem
}

.tui-space_bottom-4 {
    margin-bottom:1rem
}

.tui-space_bottom-3 {
    margin-bottom:.75rem
}

.tui-space_bottom-2 {
    margin-bottom:.5rem
}

.tui-space_bottom-1 {
    margin-bottom:.25rem
}

.tui-space_bottom-0 {
    margin-bottom:0rem
}

.tui-space_vertical-16 {
    margin-top: 4rem;
    margin-bottom:4rem
}

.tui-space_vertical-15 {
    margin-top: 3.75rem;
    margin-bottom:3.75rem
}

.tui-space_vertical-14 {
    margin-top: 3.5rem;
    margin-bottom:3.5rem
}

.tui-space_vertical-13 {
    margin-top: 3.25rem;
    margin-bottom:3.25rem
}

.tui-space_vertical-12 {
    margin-top: 3rem;
    margin-bottom:3rem
}

.tui-space_vertical-11 {
    margin-top: 2.75rem;
    margin-bottom:2.75rem
}

.tui-space_vertical-10 {
    margin-top: 2.5rem;
    margin-bottom:2.5rem
}

.tui-space_vertical-9 {
    margin-top: 2.25rem;
    margin-bottom:2.25rem
}

.tui-space_vertical-8 {
    margin-top: 2rem;
    margin-bottom:2rem
}

.tui-space_vertical-7 {
    margin-top: 1.75rem;
    margin-bottom:1.75rem
}

.tui-space_vertical-6 {
    margin-top: 1.5rem;
    margin-bottom:1.5rem
}

.tui-space_vertical-5 {
    margin-top: 1.25rem;
    margin-bottom:1.25rem
}

.tui-space_vertical-4 {
    margin-top: 1rem;
    margin-bottom:1rem
}

.tui-space_vertical-3 {
    margin-top: .75rem;
    margin-bottom:.75rem
}

.tui-space_vertical-2 {
    margin-top: .5rem;
    margin-bottom:.5rem
}

.tui-space_vertical-1 {
    margin-top: .25rem;
    margin-bottom:.25rem
}

.tui-space_vertical-0 {
    margin-top: 0rem;
    margin-bottom:0rem
}

.tui-space_left-16 {
    margin-left:4rem
}

.tui-space_left-15 {
    margin-left:3.75rem
}

.tui-space_left-14 {
    margin-left:3.5rem
}

.tui-space_left-13 {
    margin-left:3.25rem
}

.tui-space_left-12 {
    margin-left:3rem
}

.tui-space_left-11 {
    margin-left:2.75rem
}

.tui-space_left-10 {
    margin-left:2.5rem
}

.tui-space_left-9 {
    margin-left:2.25rem
}

.tui-space_left-8 {
    margin-left:2rem
}

.tui-space_left-7 {
    margin-left:1.75rem
}

.tui-space_left-6 {
    margin-left:1.5rem
}

.tui-space_left-5 {
    margin-left:1.25rem
}

.tui-space_left-4 {
    margin-left:1rem
}

.tui-space_left-3 {
    margin-left:.75rem
}

.tui-space_left-2 {
    margin-left:.5rem
}

.tui-space_left-1 {
    margin-left:.25rem
}

.tui-space_left-0 {
    margin-left:0rem
}

.tui-space_right-16 {
    margin-right:4rem
}

.tui-space_right-15 {
    margin-right:3.75rem
}

.tui-space_right-14 {
    margin-right:3.5rem
}

.tui-space_right-13 {
    margin-right:3.25rem
}

.tui-space_right-12 {
    margin-right:3rem
}

.tui-space_right-11 {
    margin-right:2.75rem
}

.tui-space_right-10 {
    margin-right:2.5rem
}

.tui-space_right-9 {
    margin-right:2.25rem
}

.tui-space_right-8 {
    margin-right:2rem
}

.tui-space_right-7 {
    margin-right:1.75rem
}

.tui-space_right-6 {
    margin-right:1.5rem
}

.tui-space_right-5 {
    margin-right:1.25rem
}

.tui-space_right-4 {
    margin-right:1rem
}

.tui-space_right-3 {
    margin-right:.75rem
}

.tui-space_right-2 {
    margin-right:.5rem
}

.tui-space_right-1 {
    margin-right:.25rem
}

.tui-space_right-0 {
    margin-right:0rem
}

.tui-space_horizontal-16 {
    margin-right: 4rem;
    margin-left:4rem
}

.tui-space_horizontal-15 {
    margin-right: 3.75rem;
    margin-left:3.75rem
}

.tui-space_horizontal-14 {
    margin-right: 3.5rem;
    margin-left:3.5rem
}

.tui-space_horizontal-13 {
    margin-right: 3.25rem;
    margin-left:3.25rem
}

.tui-space_horizontal-12 {
    margin-right: 3rem;
    margin-left:3rem
}

.tui-space_horizontal-11 {
    margin-right: 2.75rem;
    margin-left:2.75rem
}

.tui-space_horizontal-10 {
    margin-right: 2.5rem;
    margin-left:2.5rem
}

.tui-space_horizontal-9 {
    margin-right: 2.25rem;
    margin-left:2.25rem
}

.tui-space_horizontal-8 {
    margin-right: 2rem;
    margin-left:2rem
}

.tui-space_horizontal-7 {
    margin-right: 1.75rem;
    margin-left:1.75rem
}

.tui-space_horizontal-6 {
    margin-right: 1.5rem;
    margin-left:1.5rem
}

.tui-space_horizontal-5 {
    margin-right: 1.25rem;
    margin-left:1.25rem
}

.tui-space_horizontal-4 {
    margin-right: 1rem;
    margin-left:1rem
}

.tui-space_horizontal-3 {
    margin-right: .75rem;
    margin-left:.75rem
}

.tui-space_horizontal-2 {
    margin-right: .5rem;
    margin-left:.5rem
}

.tui-space_horizontal-1 {
    margin-right: .25rem;
    margin-left:.25rem
}

.tui-space_horizontal-0 {
    margin-right: 0rem;
    margin-left:0rem
}

.tui-space_auto {
    margin-left: auto;
    margin-right:auto
}

.tui-table {
    width:100%
}

.tui-table_layout_fixed {
    table-layout:fixed
}

.tui-table__tr {
    transition-property: background;
    transition-duration: var(--tui-duration, .3s);
    transition-timing-function: ease-in-out;
    outline:none
}

.tui-table__tr:not(.tui-table__tr_hover_disabled):hover {
    background:var(--tui-base-02)
}

.tui-table__tr:not(.tui-table__tr_border_none) {
    border-bottom:1px solid var(--tui-base-03)
}

.tui-table__tr_border_top {
    border-top:1px solid var(--tui-base-03)
}

.tui-table__tr_cursor_pointer {
    cursor:pointer
}

.tui-table__th {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font: var(--tui-font-text-s);
    padding: .5rem 1rem;
    vertical-align: middle;
    height: 2.5rem;
    color: var(--tui-text-02);
    background:inherit
}

.tui-table__th_font-size_l, .tui-table_font-size_l .tui-table__th {
    font:var(--tui-font-text-m)
}

.tui-table__td {
    font: var(--tui-font-text-m);
    padding: 1rem 1rem .875rem;
    vertical-align: top;
    word-wrap: break-word;
    height: 3.4375rem;
    color: var(--tui-text-01);
    background:inherit
}

.tui-table__td_size_l, .tui-table_size_l .tui-table__td {
    height:4.9375rem
}

.tui-table__td_font-size_l, .tui-table_font-size_l .tui-table__td {
    font:var(--tui-font-text-l)
}

.tui-table__td_font-size_s, .tui-table_font-size_s .tui-table__td {
    font:var(--tui-font-text-s)
}

.tui-table__td_align_center {
    vertical-align:middle
}

.tui-table__td, .tui-table__th {
    box-sizing: border-box;
    text-align:left
}

.tui-table_size_l .tui-table__td:before, .tui-table_size_l .tui-table__th:before {
    width: 1rem;
    border-top-left-radius: 1rem;
    border-bottom-left-radius:1rem
}

.tui-table__td_first:before, .tui-table__th_first:before, .tui-table__td_last:before, .tui-table__th_last:before {
    content: "";
    position: absolute;
    top: 0;
    width: .75rem;
    height: 100%;
    background: inherit;
    border-top-left-radius: .75rem;
    border-bottom-left-radius:.75rem
}

.tui-table__td_first, .tui-table__th_first {
    position: relative;
    padding-left: 0;
    overflow:visible
}

.tui-table__td_first:before, .tui-table__th_first:before {
    right:100%
}

.tui-table__td_last, .tui-table__th_last {
    position: relative;
    padding-right: 0;
    overflow:visible
}

.tui-table__td_last:before, .tui-table__th_last:before {
    left: 100%;
    transform:scaleX(-1)
}

.tui-table__td_text_center, .tui-table__th_text_center {
    text-align:center
}

.tui-table__td_text_right, .tui-table__th_text_right {
    text-align:right
}

.tui-table__td_text_overflow, .tui-table__th_text_overflow {
    white-space: nowrap;
    overflow: hidden;
    text-overflow:ellipsis
}

.tui-table__subtext {
    font: var(--tui-font-text-s);
    margin: .25rem 0 0;
    color:var(--tui-text-03)
}

.tui-table__sort {
    appearance: none;
    padding: 0;
    border: 0;
    background: none;
    font-size: inherit;
    line-height: inherit;
    text-decoration: none;
    transition-property: color;
    transition-duration: var(--tui-duration, .3s);
    transition-timing-function: ease-in-out;
    position: relative;
    display: inline-flex;
    align-items: center;
    outline: none;
    cursor:pointer
}

.tui-table__sort:hover {
    color:var(--tui-text-01)
}

.tui-table__sort_active {
    color:var(--tui-link)
}

.tui-table__sort_active:hover {
    color:var(--tui-link-hover)
}

.tui-table__sort-icon {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 100%;
    margin-left: .125rem;
    width: 1rem;
    height: 1rem;
    flex-shrink: 0;
    opacity:0
}

.tui-table__sort_active .tui-table__sort-icon, .tui-table__sort:hover .tui-table__sort-icon {
    transition-property: transform;
    transition-duration: var(--tui-duration, .3s);
    transition-timing-function: ease-in-out;
    opacity:1
}

.tui-table__sort_active.tui-table__sort_up .tui-table__sort-icon {
    transform:rotate(180deg) translateY(50%)
}

.tui-text_h1 {
    font:var(--tui-font-heading-1)
}

.tui-text_h2 {
    font:var(--tui-font-heading-2)
}

.tui-text_h3 {
    font:var(--tui-font-heading-3)
}

.tui-text_h4 {
    font:var(--tui-font-heading-4)
}

.tui-text_h5 {
    font:var(--tui-font-heading-5)
}

.tui-text_h6 {
    font:var(--tui-font-heading-6)
}

.tui-text_body-xl {
    font:var(--tui-font-text-xl)
}

.tui-text_body-l {
    font:var(--tui-font-text-l)
}

.tui-text_body-l-2 {
    font:var(--tui-font-text-l-2)
}

.tui-text_body-m {
    font:var(--tui-font-text-m)
}

.tui-text_body-m-2 {
    font:var(--tui-font-text-m-2)
}

.tui-text_body-s {
    font:var(--tui-font-text-s)
}

.tui-text_body-s-2 {
    font:var(--tui-font-text-s-2)
}

.tui-text_body-xs {
    font:var(--tui-font-text-xs)
}

.tui-text_bold {
    font-weight:700
}

:root {
    --font-heading: "Inter", "Verdana", "Tahoma", sans-serif;
    --text-font: "Inter", "Verdana", "Tahoma", sans-serif;
    --font-heading-l: 700 1.875rem/2.5rem var(--font-heading);
    --font-heading-lm: 700 1.625rem/2.5rem var(--font-heading);
    --font-heading-m: 700 1.25rem/1.5rem var(--font-heading);
    --font-heading-s: 700 1.0625rem/1.25rem var(--font-heading);
    --font-heading-xs: 550 .9375rem/1.125rem var(--font-heading);
    --font-text-l: 400 1.0625rem/1.25rem var(--text-font);
    --font-text-l-higher: 400 1.0625rem/1.5rem var(--text-font);
    --font-text-l-bold: 500 1.0625rem/1.25rem var(--text-font);
    --font-text-m: 400 .9375rem/1.125rem var(--text-font);
    --font-text-m-bold: 600 .9375rem/1.125rem var(--text-font);
    --font-text-s: 400 .8125rem/1rem var(--text-font);
    --font-text-s-bold: 600 .8125rem/1rem var(--text-font);
    --text-primary: #1d2026;
    --text-secondary: rgba(23, 28, 38, .45);
    --text-tertiary: rgba(0, 12, 36, .22);
    --text-tertiary-on-dark: rgba(229, 238, 255, .25);
    --text-opposite: #ffffff;
    --text-brand: #e55415;
    --text-brand-2: #ff5d15;
    --text-accent: #2101e5;
    --text-primary-on-dark: #e8eaee;
    --text-primary-on-light: #1d2026;
    --text-secondary-on-dark: rgba(230, 238, 255, .45);
    --text-success: #0fa945;
    --text-error: #f40505;
    --text-attention: #d21fd6;
    --text-accent-pressed: #0b0bb3;
    --text-day-primary: #121416;
    --text-day-primary-alpha: rgba(18, 20, 22, 0);
    --text-day-primary-2: #27282a;
    --text-day-secondary: rgba(23, 28, 38, .45);
    --text-day-web-header: #272c34;
    --text-night-primary: #f2f4f8;
    --text-day-tertiary: #93969f;
    --foreground-primary: #272c34;
    --foreground-secondary: rgba(23, 28, 38, .35);
    --foreground-tertiary: rgba(28, 39, 61, .15);
    --foreground-brand: #ff5d16;
    --foreground-accent: #2401fe;
    --foreground-primary-on-dark: #ffffff;
    --foreground-primary-on-light: #272c34;
    --foreground-secondary-on-dark: rgba(229, 238, 255, .55);
    --foreground-tertiary-on-dark: rgba(197, 209, 232, .3);
    --foreground-success: #02c646;
    --foreground-error: #ff0000;
    --foreground-attention: #e809ed;
    --foreground-accent-pressed: #0828a6;
    --background-base: #ffffff;
    --background-web-base: #121214;
    --background-web-base-apha-zero: #12121400;
    --background-web-base-light: #f5f6f9;
    --background-web-base-light-2: #f7f8fa;
    --background-web-base-light-3: #f7f8fb;
    --background-web-base-light-4: #ececec;
    --background-elevation-1: #ffffff;
    --background-elevation-2: #ffffff;
    --background-elevation-3: #ffffff;
    --background-neutral-1: rgba(0, 37, 112, .04);
    --background-neutral-1-on-dark: rgba(225, 233, 250, .06);
    --background-neutral-1-hover: rgba(75, 113, 189, .03);
    --background-neutral-2: rgba(33, 60, 112, .11);
    --background-neutral-2-on-dark: rgba(199, 211, 235, .35);
    --background-darkish: rgba(230, 238, 255, .55);
    --background-translucent-white: rgba(255, 255, 255, .1);
    --background-translucent-white-2: rgba(245, 246, 249, 0);
    --background-deep-darkish: rgba(39, 39, 40, .8);
    --background-brand: #ff5d16;
    --background-brand-2: #fe6c2c;
    --background-brand-pressed: #ed4a0e;
    --background-brand-pressed-2: #e04500;
    --background-brand-hover: #ff6e14;
    --background-brand-pale-1: #fdeae3;
    --background-brand-pale-2: #fdd2bf;
    --background-brand-pale-3: #fda179;
    --background-brand-dark: rgba(255, 93, 21, .1);
    --background-success: rgba(13, 193, 67, .15);
    --background-error: rgba(255, 0, 0, .15);
    --background-primary-on-dark: #ffffff;
    --background-primary-on-dark-pressed: #eeeff0;
    --night-background-elevation-2: #27282b;
    --background-accent: #2401fe;
    --background-accent-pressed: #0828a6;
    --background-accent-hover: #1a5bff;
    --background-accent-alpha: rgba(36, 1, 254, .05);
    --background-tertiary-dark: #191a1c;
    --background-day-web-header: rgba(245, 246, 249, .8);
    --background-translucent: rgba(0, 0, 0, .4);
    --background-gray-custom: rgba(142, 127, 160, .14);
    --background-gray-custom-2: rgba(175, 181, 195, .15);
    --background-pure-dark: #000000;
    --background-navigation-bar: hsla(240, 2%, 83%, .1);
    --gradient-primary-vertical: linear-gradient(178.01deg, #ff5e01 1.47%, #d626a5 47.79%, #2401fe 98.14%);
    --gradient-primary-right-to-left: linear-gradient(270deg, #ff5e01 .17%, #cc2b9f 67.24%, #2401fe 100%);
    --gradient-cashback-horizontal: linear-gradient(90deg, #ff4e01 20.83%, #fa0b61 56.61%, #c609c5 75.14%, #2401fe 100%);
    --gradient-offer-brand: radial-gradient(100% 318.81% at 0% 100%, #ff3d00 0%, #ff7a00 100%);
    --gradient-offer-accent: radial-gradient(102.5% 102.5% at 100% 100%, #ff3d00 2.08%, #a83065 26.64%, #2401fe 87.5%);
    --gradient-secondary-icon-stroke: linear-gradient(180deg, #ffffff 0%, rgba(255, 255, 255, .7) 100%);
    --gradient-brand-icon-stroke: linear-gradient(90deg, #ff5300 0%, #ff3d00 100%);
    --gradient-accent-icon-stroke: linear-gradient(180deg, #941dc0 0%, #2401fe 100%);
    --gradient-brand-icon-fill: linear-gradient(180deg, #ffd8cb 0%, #ffffff 100%);
    --gradient-accent-icon-fill: linear-gradient(180deg, #c8cdff 0%, #ffffff 100%);
    --day-gradient-icon-view-overlay: linear-gradient(180deg, rgba(255, 255, 255, .2) 0%, rgba(255, 255, 255, 0) 100%);
    --gradient-graphite-card: linear-gradient(247.95deg, #4a5468 0%, #131414 100%);
    --gradient-border-on-card: linear-gradient(91.59deg, rgba(255, 255, 255, .05) 8.39%, rgba(255, 255, 255, 0) 49.71%, rgba(255, 255, 255, .05) 97.52%);
    --gradient-security-sertified-plate: linear-gradient(123deg, rgba(255, 255, 255, .02) 30.11%, rgba(255, 255, 255, .04) 48.33%, rgba(255, 255, 255, .02) 65.1%);
    --gradient-card-border: linear-gradient(133.07deg, rgba(255, 255, 255, .2) 0%, rgba(255, 255, 255, 0) 50.52%, rgba(255, 255, 255, .2) 100%);
    --gradient-gray-icon: linear-gradient(110deg, #4b5053 36.12%, #1f2122 82.77%);
    --gradient-dark-card-plate: linear-gradient(123.45deg, rgba(255, 255, 255, .03) 30.11%, rgba(255, 255, 255, .05) 48.33%, rgba(255, 255, 255, .03) 65.1%);
    --gradient-about-title: linear-gradient(90deg, rgba(242, 244, 248, .59) .83%, #f2f4f8 64.15%, rgba(242, 244, 248, .48) 93.29%);
    --service-navbar: rgba(255, 255, 255, .8);
    --service-navigation-primary: rgba(0, 0, 0, .05);
    --service-shimmer: linear-gradient(90deg, #9b9ea6 0%, rgba(155, 158, 166, .22) 48.69%, #9b9ea6 103.88%);
    --mc_logo_red: #eb001b;
    --mc_logo_yellow: #f79e1b;
    --mc_logo_orange: #f16122;
    --appgallery-logo: #c8102e;
    --appstore-button-hover: #252525;
    --medium-shadow: 0 .375rem 2.125rem rgba(32, 47, 78, .12);
    --medium-shadow-hover: 0 .625rem 2.125rem rgba(32, 47, 78, .18);
    --small-shadow: 0 .25rem 1rem rgba(32, 47, 78, .15);
    --small-brand-shadow: 0 .25rem 1rem rgba(255, 93, 22, .4);
    --small-accent-shadow: 0 .25rem 1rem rgba(16, 0, 121, .4);
    --card-hover-dark-shadow: 0 .375rem 2.125rem 0 rgba(11, 12, 15, .4);
    --height-l: 3.5rem;
    --height-m: 3rem;
    --height-s: 2.5rem;
    --height-xs: 2rem;
    --radius-xxl: 2.25rem;
    --radius-xl: 2rem;
    --radius-l: 1rem;
    --radius-m: .75rem
}

.dif-container {
    width: auto;
    padding:0 2.5rem
}

@media screen and (max-width: 47.9625em) {
    .dif-container {
        padding: 0 1.25rem;
        box-sizing:border-box
    }
}

.dif-row {
    display: flex;
    flex-wrap:wrap
}

@media screen and (min-width: 80em) {
    .dif-row {
        margin-left: -2.5rem;
        margin-right:-2.5rem
    }
}

@media screen and (max-width: 79.9625em) {
    .dif-row {
        margin-left: -2.5rem;
        margin-right:-2.5rem
    }
}

@media screen and (max-width: 47.9625em) {
    .dif-row {
        margin-left: -1.25rem;
        margin-right:-1.25rem
    }
}

@media screen and (min-width: 80em) {
    .dif-col_lg-1 {
        width: 8.33333333%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .dif-col_lg-2 {
        width: 16.66666667%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .dif-col_lg-3 {
        width: 25%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .dif-col_lg-4 {
        width: 33.33333333%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .dif-col_lg-5 {
        width: 41.66666667%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .dif-col_lg-6 {
        width: 50%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .dif-col_lg-7 {
        width: 58.33333333%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .dif-col_lg-8 {
        width: 66.66666667%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .dif-col_lg-9 {
        width: 75%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .dif-col_lg-10 {
        width: 83.33333333%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .dif-col_lg-11 {
        width: 91.66666667%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .dif-col_lg-12 {
        width: 100%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }
}

@media screen and (max-width: 79.9625em) {
    .dif-col_md-1 {
        width: 8.33333333%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .dif-col_md-2 {
        width: 16.66666667%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .dif-col_md-3 {
        width: 25%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .dif-col_md-4 {
        width: 33.33333333%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .dif-col_md-5 {
        width: 41.66666667%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .dif-col_md-6 {
        width: 50%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .dif-col_md-7 {
        width: 58.33333333%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .dif-col_md-8 {
        width: 66.66666667%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .dif-col_md-9 {
        width: 75%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .dif-col_md-10 {
        width: 83.33333333%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .dif-col_md-11 {
        width: 91.66666667%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }

    .dif-col_md-12 {
        width: 100%;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        box-sizing:border-box
    }
}

@media screen and (max-width: 47.9625em) {
    .dif-col_xs-1 {
        width: 8.33333333%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing:border-box
    }

    .dif-col_xs-2 {
        width: 16.66666667%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing:border-box
    }

    .dif-col_xs-3 {
        width: 25%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing:border-box
    }

    .dif-col_xs-4 {
        width: 33.33333333%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing:border-box
    }

    .dif-col_xs-5 {
        width: 41.66666667%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing:border-box
    }

    .dif-col_xs-6 {
        width: 50%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing:border-box
    }

    .dif-col_xs-7 {
        width: 58.33333333%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing:border-box
    }

    .dif-col_xs-8 {
        width: 66.66666667%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing:border-box
    }

    .dif-col_xs-9 {
        width: 75%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing:border-box
    }

    .dif-col_xs-10 {
        width: 83.33333333%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing:border-box
    }

    .dif-col_xs-11 {
        width: 91.66666667%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing:border-box
    }

    .dif-col_xs-12 {
        width: 100%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing:border-box
    }
}

@media (min-width: 22.5em) and(max-width: 47.9625em) {
    .dif-col-offset_xs-1 {
        margin-left:8.33333333%
    }

    .dif-col-offset_xs-2 {
        margin-left:16.66666667%
    }

    .dif-col-offset_xs-3 {
        margin-left:25%
    }

    .dif-col-offset_xs-4 {
        margin-left:33.33333333%
    }

    .dif-col-offset_xs-5 {
        margin-left:41.66666667%
    }

    .dif-col-offset_xs-6 {
        margin-left:50%
    }

    .dif-col-offset_xs-7 {
        margin-left:58.33333333%
    }

    .dif-col-offset_xs-8 {
        margin-left:66.66666667%
    }

    .dif-col-offset_xs-9 {
        margin-left:75%
    }

    .dif-col-offset_xs-10 {
        margin-left:83.33333333%
    }

    .dif-col-offset_xs-11 {
        margin-left:91.66666667%
    }

    .dif-col-offset_xs-12 {
        margin-left:100%
    }
}

@media screen and (max-width: 79.9625em) {
    .dif-col-offset_md-1 {
        margin-left:8.33333333%
    }

    .dif-col-offset_md-2 {
        margin-left:16.66666667%
    }

    .dif-col-offset_md-3 {
        margin-left:25%
    }

    .dif-col-offset_md-4 {
        margin-left:33.33333333%
    }

    .dif-col-offset_md-5 {
        margin-left:41.66666667%
    }

    .dif-col-offset_md-6 {
        margin-left:50%
    }

    .dif-col-offset_md-7 {
        margin-left:58.33333333%
    }

    .dif-col-offset_md-8 {
        margin-left:66.66666667%
    }

    .dif-col-offset_md-9 {
        margin-left:75%
    }

    .dif-col-offset_md-10 {
        margin-left:83.33333333%
    }

    .dif-col-offset_md-11 {
        margin-left:91.66666667%
    }

    .dif-col-offset_md-12 {
        margin-left:100%
    }
}

@media screen and (min-width: 80em) {
    .dif-col-offset_lg-1 {
        margin-left:8.33333333%
    }

    .dif-col-offset_lg-2 {
        margin-left:16.66666667%
    }

    .dif-col-offset_lg-3 {
        margin-left:25%
    }

    .dif-col-offset_lg-4 {
        margin-left:33.33333333%
    }

    .dif-col-offset_lg-5 {
        margin-left:41.66666667%
    }

    .dif-col-offset_lg-6 {
        margin-left:50%
    }

    .dif-col-offset_lg-7 {
        margin-left:58.33333333%
    }

    .dif-col-offset_lg-8 {
        margin-left:66.66666667%
    }

    .dif-col-offset_lg-9 {
        margin-left:75%
    }

    .dif-col-offset_lg-10 {
        margin-left:83.33333333%
    }

    .dif-col-offset_lg-11 {
        margin-left:91.66666667%
    }

    .dif-col-offset_lg-12 {
        margin-left:100%
    }
}

:root {
    --spacing-xs: .5rem;
    --spacing-s: 1rem;
    --spacing-m: 1.25rem;
    --spacing-l: 2rem;
    --spacing-xl: 2.5rem;
    --spacing-xxl: 3rem;
    --tui-font-heading: var(--font-heading);
    --tui-font-heading-1: var(--font-heading-l);
    --tui-font-heading-2: var(--font-heading-m);
    --tui-font-heading-3: var(--font-heading-s);
    --tui-font-heading-4: var(--font-heading-xs);
    --tui-font-heading-5: var(--font-heading-xs);
    --tui-font-heading-6: var(--font-heading-xs);
    --tui-font-text: var(--text-font);
    --tui-font-text-xl: var(--font-text-l);
    --tui-font-text-l: var(--font-text-l);
    --tui-font-text-m: var(--font-text-m);
    --tui-font-text-s: var(--font-text-s);
    --tui-font-text-xs: var(--font-text-s);
    --tui-radius-xs: var(--radius-m);
    --tui-radius-s: var(--radius-m);
    --tui-radius-m: var(--radius-m);
    --tui-radius-l: var(--radius-l);
    --tui-height-xs: var(--height-s);
    --tui-height-s: var(--height-s);
    --tui-height-m: var(--height-m);
    --tui-height-l: var(--height-l);
    --tui-padding-s: .75rem;
    --tui-padding-m: .75rem;
    --tui-padding-l: 1rem;
    --tui-duration: .2s;
    --tui-disabled-opacity: .56;
    --tui-autofill: #fff5c0;
    --tui-base-01: var(--background-base);
    --tui-base-02: #f6f6f6;
    --tui-base-03: #ededed;
    --tui-base-04: #d7d7d7;
    --tui-base-05: #b0b0b0;
    --tui-base-06: #959595;
    --tui-base-07: #808080;
    --tui-base-08: #333;
    --tui-base-09: #000;
    --tui-primary: var(--background-brand);
    --tui-primary-hover: var(--background-brand-hover);
    --tui-primary-active: var(--background-brand-pressed);
    --tui-primary-text: var(--text-primary-on-dark);
    --tui-secondary: var(--background-neutral-1);
    --tui-secondary-hover: var(--background-neutral-1-hover);
    --tui-secondary-active: var(--background-neutral-2);
    --tui-accent: var(--foreground-accent);
    --tui-accent-hover: #ff9a94;
    --tui-accent-active: var(--foreground-accent-pressed);
    --tui-accent-text: #fff;
    --tui-selection: rgba(112, 182, 246, .12);
    --tui-focus: rgba(51, 51, 51, .64);
    --tui-clear: rgba(0, 0, 0, .08);
    --tui-clear-disabled: rgba(0, 0, 0, .04);
    --tui-clear-hover: rgba(0, 0, 0, .16);
    --tui-clear-active: rgba(0, 0, 0, .2);
    --tui-clear-inverse: rgba(255, 255, 255, .16);
    --tui-clear-inverse-hover: rgba(255, 255, 255, .24);
    --tui-clear-inverse-active: rgba(255, 255, 255, .4);
    --tui-elevation-01: #fff;
    --tui-elevation-02: #fff;
    --tui-error-fill: #f45725;
    --tui-error-bg: rgba(244, 87, 37, .12);
    --tui-error-bg-hover: rgba(244, 87, 37, .24);
    --tui-success-fill: #4ac99b;
    --tui-success-bg: rgba(74, 201, 155, .12);
    --tui-success-bg-hover: rgba(74, 201, 155, .24);
    --tui-warning-fill: #ffc700;
    --tui-warning-bg: rgba(255, 199, 0, .12);
    --tui-warning-bg-hover: rgba(255, 199, 0, .24);
    --tui-info-fill: #70b6f6;
    --tui-info-bg: rgba(112, 182, 246, .12);
    --tui-info-bg-hover: rgba(112, 182, 246, .24);
    --tui-neutral-fill: #79818c;
    --tui-neutral-bg: rgba(121, 129, 140, .12);
    --tui-neutral-bg-hover: rgba(121, 129, 140, .24);
    --tui-text-01: #1b1f3b;
    --tui-text-02: rgba(27, 31, 59, .65);
    --tui-text-03: rgba(27, 31, 59, .4);
    --tui-link: var(--text-accent);
    --tui-link-hover: var(--text-accent-pressed);
    --tui-positive: #3aa981;
    --tui-positive-hover: #7ac5aa;
    --tui-negative: #dd4c1e;
    --tui-negative-hover: #e38163;
    --tui-error-fill-night: #ff8c67;
    --tui-error-bg-night: rgba(244, 87, 37, .32);
    --tui-error-bg-night-hover: rgba(244, 87, 37, .4);
    --tui-success-fill-night: #4ac99b;
    --tui-success-bg-night: rgba(74, 201, 155, .32);
    --tui-success-bg-night-hover: rgba(74, 201, 155, .4);
    --tui-warning-fill-night: #ffc700;
    --tui-warning-bg-night: rgba(255, 199, 0, .32);
    --tui-warning-bg-night-hover: rgba(255, 199, 0, .4);
    --tui-info-fill-night: #70b6f6;
    --tui-info-bg-night: rgba(112, 182, 246, .32);
    --tui-info-bg-night-hover: rgba(112, 182, 246, .4);
    --tui-neutral-fill-night: #959ba4;
    --tui-neutral-bg-night: rgba(149, 155, 164, .32);
    --tui-neutral-bg-night-hover: rgba(149, 155, 164, .48);
    --tui-autofill-night: #554a2a;
    --tui-text-01-night: #ffffff;
    --tui-text-02-night: rgba(255, 255, 255, .72);
    --tui-text-03-night: rgba(255, 255, 255, .6);
    --tui-link-night: #6788ff;
    --tui-link-night-hover: #526ed3;
    --tui-positive-night: #44c596;
    --tui-positive-night-hover: #3aa981;
    --tui-negative-night: #ff8c67;
    --tui-negative-night-hover: #bb593a;
    --tui-support-01: #a8cef1;
    --tui-support-02: #3682db;
    --tui-support-03: #8dda71;
    --tui-support-04: #34b41f;
    --tui-support-05: #e29398;
    --tui-support-06: #b8474e;
    --tui-support-07: #fcc068;
    --tui-support-08: #ff8a00;
    --tui-support-09: #dab3f9;
    --tui-support-10: #7b439e;
    --tui-support-11: #fee797;
    --tui-support-12: #fcbb14;
    --tui-support-13: #ea97c4;
    --tui-support-14: #bd65a4;
    --tui-support-15: #7fd7cc;
    --tui-support-16: #2fad96;
    --tui-support-17: #d4aca2;
    --tui-support-18: #9d6f64;
    --tui-support-19: #d2e9a2;
    --tui-support-20: #aadc42;
    --tui-support-21: #a0c5df;
    --tui-chart-0: var(--tui-primary);
    --tui-chart-1: var(--tui-support-13);
    --tui-chart-2: var(--tui-support-21);
    --tui-chart-3: var(--tui-support-11);
    --tui-chart-4: var(--tui-base-05)
}

[tuiButton][data-size=l] [tuiWrapper], [tuiIconButton][data-size=l] [tuiWrapper] {
    font: var(--font-text-l-bold);
    border-radius:1rem
}

[tuiButton][data-size=m] [tuiWrapper], [tuiIconButton][data-size=m] [tuiWrapper] {
    font:var(--font-text-m-bold)
}

[tuiButton][data-size=s] [tuiWrapper], [tuiIconButton][data-size=s] [tuiWrapper] {
    font: var(--font-text-m-bold);
    max-height:2.25rem
}

[tuiButton] [tuiWrapper], [tuiIconButton] [tuiWrapper] {
    color:var(--text-opposite)
}

[tuiButton] [tuiWrapper][data-appearance=dif-primary], [tuiIconButton] [tuiWrapper][data-appearance=dif-primary] {
    background-color:var(--background-brand)
}

@media (hover: hover) {
    [tuiButton] [tuiWrapper][data-appearance=dif-primary]:hover:not(._no-hover), [tuiIconButton] [tuiWrapper][data-appearance=dif-primary]:hover:not(._no-hover), [tuiButton] [tuiWrapper][data-appearance=dif-primary][data-state=hover], [tuiIconButton] [tuiWrapper][data-appearance=dif-primary][data-state=hover] {
        background-color:var(--background-brand-hover)
    }
}

[tuiButton] [tuiWrapper][data-appearance=dif-primary]:active:not(._no-active), [tuiIconButton] [tuiWrapper][data-appearance=dif-primary]:active:not(._no-active), [tuiButton] [tuiWrapper][data-appearance=dif-primary][data-state=active], [tuiIconButton] [tuiWrapper][data-appearance=dif-primary][data-state=active], [tuiButton] [tuiWrapper][data-appearance=dif-primary][data-state=active]:hover, [tuiIconButton] [tuiWrapper][data-appearance=dif-primary][data-state=active]:hover {
    background-color:var(--background-brand-pressed)
}

[tuiButton] [tuiWrapper][data-appearance=dif-secondary], [tuiIconButton] [tuiWrapper][data-appearance=dif-secondary] {
    background-color: var(--background-neutral-1);
    color:var(--text-primary)
}

@media (hover: hover) {
    [tuiButton] [tuiWrapper][data-appearance=dif-secondary]:hover:not(._no-hover), [tuiIconButton] [tuiWrapper][data-appearance=dif-secondary]:hover:not(._no-hover), [tuiButton] [tuiWrapper][data-appearance=dif-secondary][data-state=hover], [tuiIconButton] [tuiWrapper][data-appearance=dif-secondary][data-state=hover] {
        background-color:var(--background-neutral-1-hover)
    }
}

[tuiButton] [tuiWrapper][data-appearance=dif-secondary]:active:not(._no-active), [tuiIconButton] [tuiWrapper][data-appearance=dif-secondary]:active:not(._no-active), [tuiButton] [tuiWrapper][data-appearance=dif-secondary][data-state=active], [tuiIconButton] [tuiWrapper][data-appearance=dif-secondary][data-state=active], [tuiButton] [tuiWrapper][data-appearance=dif-secondary][data-state=active]:hover, [tuiIconButton] [tuiWrapper][data-appearance=dif-secondary][data-state=active]:hover {
    background-color:var(--background-neutral-2)
}

[tuiButton] [tuiWrapper][data-appearance=dif-tertiary], [tuiIconButton] [tuiWrapper][data-appearance=dif-tertiary] {
    color:var(--text-primary)
}

@media (hover: hover) {
    [tuiButton] [tuiWrapper][data-appearance=dif-tertiary]:hover:not(._no-hover), [tuiIconButton] [tuiWrapper][data-appearance=dif-tertiary]:hover:not(._no-hover), [tuiButton] [tuiWrapper][data-appearance=dif-tertiary][data-state=hover], [tuiIconButton] [tuiWrapper][data-appearance=dif-tertiary][data-state=hover] {
        background-color:var(--background-neutral-1-hover)
    }
}

[tuiButton] [tuiWrapper][data-appearance=dif-tertiary]:active:not(._no-active), [tuiIconButton] [tuiWrapper][data-appearance=dif-tertiary]:active:not(._no-active), [tuiButton] [tuiWrapper][data-appearance=dif-tertiary][data-state=active], [tuiIconButton] [tuiWrapper][data-appearance=dif-tertiary][data-state=active], [tuiButton] [tuiWrapper][data-appearance=dif-tertiary][data-state=active]:hover, [tuiIconButton] [tuiWrapper][data-appearance=dif-tertiary][data-state=active]:hover {
    background-color:var(--background-neutral-1)
}

[tuiButton] [tuiWrapper][data-appearance=dif-white], [tuiIconButton] [tuiWrapper][data-appearance=dif-white] {
    background-color: #fff;
    color:var(--text-primary-on-light)
}

@media (hover: hover) {
    [tuiButton] [tuiWrapper][data-appearance=dif-white]:hover:not(._no-hover), [tuiIconButton] [tuiWrapper][data-appearance=dif-white]:hover:not(._no-hover), [tuiButton] [tuiWrapper][data-appearance=dif-white][data-state=hover], [tuiIconButton] [tuiWrapper][data-appearance=dif-white][data-state=hover] {
        background-color:#eeeff0
    }
}

[tuiButton] [tuiWrapper][data-appearance=dif-white]:active:not(._no-active), [tuiIconButton] [tuiWrapper][data-appearance=dif-white]:active:not(._no-active), [tuiButton] [tuiWrapper][data-appearance=dif-white][data-state=active], [tuiIconButton] [tuiWrapper][data-appearance=dif-white][data-state=active], [tuiButton] [tuiWrapper][data-appearance=dif-white][data-state=active]:hover, [tuiIconButton] [tuiWrapper][data-appearance=dif-white][data-state=active]:hover {
    background-color:#eeeff0
}

[tuiButton] [tuiWrapper][data-appearance=mono], [tuiIconButton] [tuiWrapper][data-appearance=mono] {
    color:var(--text-primary-on-light)
}

[tuiButton] [tuiWrapper][data-appearance=dif-dark], [tuiIconButton] [tuiWrapper][data-appearance=dif-dark] {
    background-color: var(--foreground-tertiary-on-dark);
    color:var(--text-primary-on-dark)
}

@media (hover: hover) {
    [tuiButton] [tuiWrapper][data-appearance=dif-dark]:hover:not(._no-hover), [tuiIconButton] [tuiWrapper][data-appearance=dif-dark]:hover:not(._no-hover), [tuiButton] [tuiWrapper][data-appearance=dif-dark][data-state=hover], [tuiIconButton] [tuiWrapper][data-appearance=dif-dark][data-state=hover] {
        background-color:var(--background-neutral-2-on-dark)
    }
}

[tuiButton] [tuiWrapper][data-appearance=dif-dark]:active:not(._no-active), [tuiIconButton] [tuiWrapper][data-appearance=dif-dark]:active:not(._no-active), [tuiButton] [tuiWrapper][data-appearance=dif-dark][data-state=active], [tuiIconButton] [tuiWrapper][data-appearance=dif-dark][data-state=active], [tuiButton] [tuiWrapper][data-appearance=dif-dark][data-state=active]:hover, [tuiIconButton] [tuiWrapper][data-appearance=dif-dark][data-state=active]:hover {
    background-color:var(--background-neutral-2-on-dark)
}

[tuiButton] [tuiWrapper][data-appearance=dif-dark-close], [tuiIconButton] [tuiWrapper][data-appearance=dif-dark-close] {
    background-color: var(--background-neutral-1-on-dark);
    color:var(--text-opposite)
}

@media (hover: hover) {
    [tuiButton] [tuiWrapper][data-appearance=dif-dark-close]:hover:not(._no-hover), [tuiIconButton] [tuiWrapper][data-appearance=dif-dark-close]:hover:not(._no-hover), [tuiButton] [tuiWrapper][data-appearance=dif-dark-close][data-state=hover], [tuiIconButton] [tuiWrapper][data-appearance=dif-dark-close][data-state=hover] {
        background-color:var(--background-neutral-1-hover)
    }
}

[tuiButton] [tuiWrapper][data-appearance=dif-dark-close]:active:not(._no-active), [tuiIconButton] [tuiWrapper][data-appearance=dif-dark-close]:active:not(._no-active), [tuiButton] [tuiWrapper][data-appearance=dif-dark-close][data-state=active], [tuiIconButton] [tuiWrapper][data-appearance=dif-dark-close][data-state=active], [tuiButton] [tuiWrapper][data-appearance=dif-dark-close][data-state=active]:hover, [tuiIconButton] [tuiWrapper][data-appearance=dif-dark-close][data-state=active]:hover {
    background-color:var(--background-neutral-1-hover)
}

[tuiButton]._disabled [tuiWrapper][data-appearance=secondary], [tuiIconButton]._disabled [tuiWrapper][data-appearance=secondary], [tuiButton]._disabled [tuiWrapper][data-appearance=dif-primary], [tuiIconButton]._disabled [tuiWrapper][data-appearance=dif-primary] {
    background-color: var(--background-neutral-1);
    color:var(--text-secondary)
}

[tuiButton]._disabled [tuiWrapper][data-appearance=dif-tertiary], [tuiIconButton]._disabled [tuiWrapper][data-appearance=dif-tertiary] {
    color:var(--text-secondary)
}

tui-primitive-textfield [tuiWrapper][data-appearance=textfield] {
    background-color: var(--background-neutral-1);
    box-shadow:none
}

@media (hover: hover) {
    tui-primitive-textfield [tuiWrapper][data-appearance=textfield]:hover {
        background-color: var(--background-neutral-2);
        box-shadow:none !important
    }
}

tui-primitive-textfield [tuiWrapper][data-appearance=textfield]._focused._focused {
    background-color: var(--background-neutral-1);
    box-shadow:none !important
}

tui-primitive-textfield [tuiWrapper][data-appearance=textfield]:after {
    border-width:0 !important
}

tui-primitive-textfield [tuiWrapper][data-appearance=textfield] input[tuiTextField], tui-primitive-textfield [tuiWrapper][data-appearance=textfield] .t-input, tui-primitive-textfield [tuiWrapper][data-appearance=textfield] .t-inline {
    font:var(--font-text-l)
}

tui-primitive-textfield [tuiWrapper][data-appearance=textfield] .t-filler.t-inline {
    font: var(--font-text-l);
    padding-top:.1875rem
}

tui-primitive-textfield [tuiWrapper][data-appearance=textfield] .t-placeholder {
    font:var(--font-text-l) !important
}

tui-primitive-textfield [tuiWrapper][data-appearance=textfield] .t-placeholder_raised {
    font: var(--font-text-s) !important;
    color:var(--text-secondary) !important
}

tui-primitive-textfield._label-outside [tuiWrapper][data-appearance=textfield] .t-filler.t-inline {
    padding-top:.0625rem
}

tui-checkbox-block [tuiWrapper][data-appearance=whiteblock]:hover:after {
    border-color:var(--foreground-secondary)
}

@media (hover: hover) {
    tui-checkbox-block [tuiWrapper][data-appearance=whiteblock]:hover:not(._no-hover), tui-checkbox-block [tuiWrapper][data-appearance=whiteblock][data-state=hover] {
        background:none
    }
}

tui-checkbox-block [tuiWrapper][data-appearance=whiteblock]:after {
    transition-property: border-color;
    transition-duration: var(--tui-duration, .3s);
    transition-timing-function: ease-in-out;
    border-color:var(--foreground-tertiary)
}

tui-checkbox-block tui-primitive-checkbox[data-size=l] {
    width: 1.375rem !important;
    height:1.375rem !important
}

tui-checkbox-block tui-primitive-checkbox[data-size=l] .t-mark {
    font-size:.75rem
}

tui-checkbox-block tui-primitive-checkbox [tuiWrapper][data-appearance=primary] {
    background: var(--foreground-success);
    color: var(--tui-primary-text);
    font-size:.75rem
}

tui-hint:before {
    content:none !important
}

tui-hint[data-appearance=dif] {
    font: var(--font-text-s);
    min-height: 1rem;
    box-shadow: var(--medium-shadow);
    background-color:var(--foreground-primary)
}

tui-dialog {
    border-radius:2.5rem !important
}

tui-root.root._mobile tui-dialog[data-size] {
    margin: auto .5rem 2rem;
    min-width:auto
}

tui-root.root._mobile tui-dialog[data-size] .t-wrapper button.t-close {
    margin-top: 1.25rem;
    margin-right: 1.25rem;
    background-color: #0025700a !important;
    height: 2rem;
    width:2rem
}

tui-root.root._mobile tui-dialog[data-size] .t-wrapper button.t-close .t-wrapper .t-content {
    color:var(--foreground-secondary) !important
}

tui-root.root._mobile tui-dialog[data-size] > .t-content {
    padding:4rem 1.25rem 2.5rem !important
}

tui-dropdown {
    border: 0 !important;
    padding: .063rem;
    border-radius: .8125rem;
    box-shadow:var(--medium-shadow) !important
}

tui-dropdown[gradient] {
    background: var(--gradient-card-border);
    border-radius:1.5rem
}

tui-dropdown[gradient] > tui-scrollbar {
    border-radius:1.5rem
}

tui-dropdown > tui-scrollbar {
    border-radius:.8125rem
}

:root {
    --tui-font-text-s: inherit;
    --header-height: 3.625rem;
    --max-content-width: 66.5rem;
    --font-heading-rothorn: "RothornVariable", "Verdana", "Tahoma", sans-serif;
    --font-heading-rothorn-xxl: 599 3.5rem/5rem var(--font-heading-rothorn);
    --font-heading-rothorn-xl: 599 3rem/3.75rem var(--font-heading-rothorn);
    --font-heading-rothorn-l: 599 1.875rem/2.5rem var(--font-heading-rothorn);
    --font-heading-rothorn-lm: 599 1.625rem/2.5rem var(--font-heading-rothorn);
    --font-heading-rothorn-m: 599 1.25rem/1.5rem var(--font-heading-rothorn);
    --font-heading-rothorn-s: 599 1.0625rem/1.25rem var(--font-heading-rothorn);
    --font-heading-rothorn-xs: 599 .9375rem/1.25rem var(--font-heading-rothorn);
    --font-base-rothorn-l: 480 1.25rem/1.875rem var(--font-heading-rothorn);
    --font-base-rothorn-lm: 420 1.0625rem/1.5rem var(--font-heading-rothorn);
    --font-base-rothorn-m: 420 1rem/1.5rem var(--font-heading-rothorn);
    --font-base-rothorn-s: 420 .875rem/1.5rem var(--font-heading-rothorn);
    --font-base-rothorn-xs: 420 .75rem/1.25rem var(--font-heading-rothorn);
    --font-heading-rothorn-new: "RothornVariableNew", "Verdana", "Tahoma", sans-serif;
    --font-heading-rothorn-new-xxl: 819 4.125rem/4.75rem var(--font-heading-rothorn-new);
    --font-heading-rothorn-new-xxl-fix: 779 4.125rem/4.75rem var(--font-heading-rothorn-new);
    --font-heading-rothorn-new-xl: 819 3rem/3.875rem var(--font-heading-rothorn-new);
    --font-heading-rothorn-new-xl-fix: 779 3rem/3.875rem var(--font-heading-rothorn-new);
    --font-heading-rothorn-new-l: 819 2.5rem/2.625rem var(--font-heading-rothorn-new);
    --font-heading-rothorn-new-l-fix: 779 2.5rem/2.625rem var(--font-heading-rothorn-new);
    --font-heading-rothorn-new-lm: 819 1.625rem/2.5rem var(--font-heading-rothorn-new);
    --font-heading-rothorn-new-lm-fix: 779 1.625rem/2.5rem var(--font-heading-rothorn-new);
    --font-heading-rothorn-new-m: 819 2.25rem/2.5rem var(--font-heading-rothorn-new);
    --font-heading-rothorn-new-m-fix: 779 2.25rem/2.5rem var(--font-heading-rothorn-new);
    --font-heading-rothorn-new-s: 599 1.5rem/2.125rem var(--font-heading-rothorn-new);
    --font-heading-rothorn-new-s-fix: 559 1.5rem/2.125rem var(--font-heading-rothorn-new);
    --font-heading-rothorn-new-xs: 559 1.25rem/1.75rem var(--font-heading-rothorn-new);
    --font-base-rothorn-new-xl: 420 1.25rem/2rem var(--font-heading-rothorn-new);
    --font-base-rothorn-new-l: 420 1.125rem/1.75rem var(--font-heading-rothorn-new);
    --font-base-rothorn-new-button-l: 480 1.125rem/1.75rem var(--font-heading-rothorn-new);
    --font-base-rothorn-new-lm: 420 1.0625rem/1.5rem var(--font-heading-rothorn-new);
    --font-base-rothorn-new-button-m: 480 1rem/1.125rem var(--font-heading-rothorn-new);
    --font-base-rothorn-new-m: 420 1rem/1.5rem var(--font-heading-rothorn-new);
    --font-base-rothorn-new-s: 420 .875rem/1.5rem var(--font-heading-rothorn-new);
    --font-base-rothorn-new-xs: 420 .813rem/1rem var(--font-heading-rothorn-new)
}

img[loading=lazy] {
    clip-path:inset(.0375rem)
}

@media screen and (max-width: 47.9625em) {
    .pull-to-refresh-block {
        -webkit-overflow-scrolling: touch;
        touch-action: none;
        overscroll-behavior:none
    }
}

div.ozliveness_container._display._visible div.ozliveness_hint_text {
    font: var(--font-heading-rothorn-m);
    font-weight: 620;
    font-size:1.25rem !important
}

.has-sidebar, .has-full-screen-dialog {
    position: relative;
    z-index:2
}

.sui-progress-bar {
    height: .5rem
}