
@font-face {
	font-family: 'inter' ;
	src: url('../__static/font/inter/InterVariable.woff2') ;
    font-weight: 300 900 ;
    font-style: normal ;
}
@font-face {
	font-family: 'stack' ;
	src: url('../__static/font/stack/StackVariable.ttf') ;
    font-weight: 300 900 ;
    font-style: normal ;
}







/*      main elements       */
* { 
    user-select: none !important ; 
    font-family: stack , sans-serif ; 
    outline: 0px ;
    outline-color: transparent ;
    -webkit-tap-highlight-color: transparent ;
    forced-color-adjust: none ;

    --white: #fefeff ;
    --black: #09090a ;
    --slate: #181819 ;
    --silver: #ececee ;
    --lgrey: #f9f9f9 ;
    --border: #dbdbe1 ;
    --dkgrey: #f5f5f5 ;

    --darkcolor: #2a2a2a ;
    --lightcolor: var(--dkgrey) ;

    --main: #1878ed ;
	--main-border: color-mix(in srgb , var(--main) , white 40%) ;
    --warn: #ed4b18 ;
    --mesh: linear-gradient(147.05deg, rgba(241, 255, 201, 0) 64.83%, #F1FFC9 77.53%, #C5F3E5 90.17%) ;
    --__dym: calc(7vw - 29px) ; /* dynamic padding */

}
.vl {
    height: 2.9px ;
    width: 0px ;
    position: absolute ;
    top: 0px ;
    left: 0px ;
    background: linear-gradient(90deg , var(--main-border) , var(--main)) fixed ;
    transition: width 0.71s ;
    z-index: 17 ;
}
body[l = '1'] .vl { width: 71% ; animation: loading 1.47s ease-out ; }
body[l = '2'] .vl { width: 0px  ; animation: load 0.79s cubic-bezier(1 , 0.01 , 0.42 , 0.88) ; }
@keyframes loading { 0% { width: 0px ;  } 41% { width: 68% ; } 100% { width: 71% ; } }
@keyframes load { 0% { width: 100% ; } 81% , 100% { width: 949% ; } 100% { left: 100vw ; } }
._load {
    height: 41px ;
    width: 181px ;
	inset: 1rem 0px auto 0px ;
	margin: auto ;
    text-align: center ;
    border-radius: 24px ;
    line-height: 41px ;
    font-size: 1.1rem ;
	pointer-events: none ;
    visibility: hidden ;
    z-index: 19 ;

	transition: visibility 0s 0.35s ;

}
body[l = '1'] ._load { visibility: visible ; }
._load svg { height: 23px ; vertical-align: text-bottom ; }
html , body { 
    height: 100vh ;
    height: 100dvh ;
    width: 100vw ;
    color-scheme: light ;
    /*
    height: -webkit-fill-available ; 
    touch-action: manipulation ; 
    -webkit-overflow-scrolling: touch ;
    overscroll-behavior-y: none ;
    */
    overflow: hidden ;
    
}
body { 
    margin: 0px ; 
    padding: 0px ; 
    background: var(--dkgrey) ;
    font-size: 17px ;
    line-height: 23px ;
    font-weight: 300 ;

	--rad_mult: 1 ;
    
}
#gloader { height: 100% ; width: 100% ; inset: 0px ; text-align: center ; z-index: 19 ; }
.gloader_progress { height: 7px ; width: 341px ; box-shadow: 0px 0px 0px 1px var(--border) inset ; border-radius: 4px ; transition: margin 0.71s 0.14s ; }
.gloader_progress .vl { height: 7px ; border-radius: 4px ; }
body._ready #gloader { animation: dspr 0.71s 0.14s forwards ; pointer-events: none ; }
@keyframes dspr {
	100% { transform: matrix(1.2 , 0 , 0 , 1.2 , 0 , 100) ; opacity: 0 ; }
}
body._ready #gloader .gloader_progress { margin-top: 41px !important ; }

.__paper { background: url(../__static/back-left.png) center / cover no-repeat var(--black) ; color: var(--lightcolor) ; }
.__mesh { background: url(../__static/__MESH2a.webp) center bottom / cover no-repeat var(--dkgrey) ; }
.__grid { background: url(../__static/media/_GRID.webp) center / cover no-repeat black ; color: var(--lightcolor) ; }
.__theme { background: url(../__static/media/backartwork.webp) center / cover no-repeat var(--lgrey) ; color: var(--darkcolor) ; }
.__dktheme { background: url(../__static/media/backartwork_dark.webp) center / cover no-repeat var(--black) ; color: var(--lightcolor) ; }
.content { height: 100% ; width: 100vw ; top: 0px ; overflow: hidden ; }
.__polkadot { background: radial-gradient(#7272766e 1px, transparent 1px) 8.1px 8.1px / 17px 17px ; }
div , yb-select , yb-switch , yb-animate , yb-etape , yb-modal , 
yb-slider , yb-drop , label , code { display: block ; position: relative ; width: 100% ;  }

code {
	font-family: monospace !important ;
	letter-spacing: -0.05rem ;
	font-size: 1rem ;
}
._label {
    padding: 0.5rem ;
    margin: 0.5rem 0px ;
    border-radius: 12px ;
    align-items: center ;

}
._pill { border-radius: 40px !important ; corner-shape: inherit ; }
.content ._pill.__logo { padding-left: 41px ; font-size: 1.3rem !important ; letter-spacing: -0.054rem ; background: url(vectoricon.svg) 11px center / 17px no-repeat ; }
._npp {
    height: 29px ;
    width: auto ;
    background: var(--dkgrey) ;
    line-height: 29px ;
    font-size: 17px ;
    padding: 0px 11px ;
    border-radius: 9px ;
}
yb-modal {
    height: 100% ;
    width: 100% ;
    inset: 0px ;
    background: #09090a4a ;
    backdrop-filter: blur(7px) ;
    z-index: 11 ;
}
yb-modal ._page { height: 409px ; }
yb-modal input { text-transform: uppercase ; }
._bs , ._label , ._page , yb-drop , dialog { box-sizing: border-box ; }
hr { border: none ; height: 1px ; background: linear-gradient(90deg , var(--border) , transparent) ; }
._black hr , ._slate hr {
	background: linear-gradient(90deg , #3a3a3b , transparent) ; 
	
}
._ovf , ._cutline { overflow: hidden ; }
._black { background-color: var(--black) !important ; color: var(--lightcolor) !important ; }
._slate { background-color: var(--slate) !important ; color: var(--lightcolor) !important ; }
._silver { background-color: var(--silver) !important ; color: var(--darkcolor) !important ; }
._white { background-color: var(--white) !important ; color: var(--darkcolor) !important ; }
._lgrey { background-color: var(--lgrey) !important ; color: var(--darkcolor) !important ; }
._dkgrey { background-color: var(--dkgrey) !important ; color: var(--darkcolor) !important ; }
.__main { background-color: var(--main) !important ; color: var(--lightcolor) !important ; }
.__clmain { color: var(--main) !important ; }
._warn { background-color: var(--warn) !important ; color: var(--lightcolor) !important ; }

.__warn { background: #FFE7C8 ; color: var(--darkcolor) ; }  
.__alert { background: #FFD9C2 ; color: var(--darkcolor) ; }  
.__critical { background: #FFCFCF ; color: var(--darkcolor) ; } 

._gpadding { padding-left: var(--__dym) !important ; padding-right: var(--__dym) !important ; }
._right { float: right ; }
._left  { float: left ; }
._fit_w { width: fit-content !important ; }
._fit_h { height: fit-content !important ; }
._flex , ._radio_ctn { display: flex !important ; }
[split] {
    display: flex ;
    gap: 0.5rem ; 
}
[split = 'y'] { flex-direction: column ; }
[split = 'x'] { flex-direction: row ; }
[columns] {
	display: grid ;
	gap: 0.5rem ;
	align-items: start ;
	width: 100% ;
}
[columns = '2'] { grid-template-columns: repeat(auto-fit , minmax(max(350px , calc((100% - 0.5rem) / 2)) , 1fr)) ; }
[columns = '3'] { grid-template-columns: repeat(auto-fit , minmax(max(350px , calc((100% - 1rem) / 3)) , 1fr)) ; }



._fill { width: 100% !important ; }
._label { width: 100% ; }
._abs { position: absolute ; }
._fxd , yb-modal , ._clone { position: fixed ; }
._sticky { position: sticky ; top: 1rem ; }
._clone { visibility: hidden ; top: -99px ; }
._mdx { left: 0px ; right: 0px ; margin-left: auto ; margin-right: auto ; }
._mdy { top: 0px ; bottom: 0px ; margin-top: auto ; margin-bottom: auto ; }
._r9 { margin-right: 9px !important ; }
._r14 { margin-right: 14px !important ; }
._l9 { margin-left: 9px !important ; }
._l14 { margin-left: 14px !important ; }
._b9 { margin-bottom: 9px !important ; }
._b14 { margin-bottom: 14px !important ; }
._t9 { margin-top: 9px !important ; }
._t14 { margin-top: 14px !important ; }
._cutline { text-overflow: ellipsis ; white-space: nowrap ; width: 100% ; }
._hide { visibility: hidden ; }
.hidden { display: none ; }
a { color: var(--darkcolor) ; text-decoration: none !important ; }
b { font-weight: 500 ; }
img { max-width: 100% ; border-radius: calc(9px * var(--rad_mult)) ; corner-shape: squircle ; }
._glass > a , ._black a { color: var(--lightcolor) ; }
._light_glass > a , ._white a { color: var(--darkcolor) ; }
._glass > a:before , ._black a:before { background: var(--lgrey) ; }
._shadow , ._input_ctn input , select , select , .lb , .sb , ._cel {
	box-shadow: 0px 0px 0px 1px var(--border) inset ;
	
}
._dkshadow , ._input_ctn input._black , ._list._black , ._list._slate ,
._black yb-switch , ._slate yb-switch {
	box-shadow: 0px 0px 0px 1px #2d2d2e inset ;
}
a:not(:is(:has(*) , .sb , .lb , ._block)) , a:has(:is(yb-animate , h1 , h2 , h3)) { font-weight: 300 ; width: auto ; position: relative ; line-height: normal ; display: inline-block ; cursor: pointer ; }
a:not(:is(:has(*) , .sb , .lb , ._block)):before , a:has(:is(yb-animate , h1 , h2 , h3)):before { 
    content: '' ; 
    height: 1px ;
    width: 100% ;
    position: absolute ;
    bottom: -4px ;
    left: 0px ;
    background: var(--black) ;
    transform: scaleX(0) ;
    transform-origin: 100% 50% ;
    transition: transform 0.51s 0.07s ;
}
a:has(:is(yb-animate , h1 , h2 , h3)):before { bottom: 7px ; }
a:not(:has(*)):hover:before , a:not(:has(*))._active:before ,
a:has(:is(yb-animate , h1 , h2 , h3)):hover:before { transform: scaleX(1) ; transform-origin: 0% 50% ; }
p { margin: 0.5rem 0px ; }
h1 { 
    height: max-content ;
    /* max-width: 81% ; */
    font-weight: 500 ;
    font-size: 2.21rem ; 
    line-height: 2.11rem ; 
    margin: 0px 0px 17px 0px ; 
    letter-spacing: -0.13rem ;
}
h2 { margin: 0px ; font-weight: 400 ; line-height: 39px ; letter-spacing: -0.07rem ; }
h1::first-letter , h2::first-letter { text-transform: uppercase ; }
h3 { margin: 7px 0px 14px 0px ; font-weight: 300 ; line-height: 1.1em ; }
h4 { margin: 7px 0px ; font-weight: 400 ; }
h5 { margin: 0px ; font-weight: 300 ; }
h6 { 
    margin: 9px 0px ;
    font-weight: 200 !important ;
    color: #fefeff81 ;
    font-size: 0.85rem ;
    line-height: 1rem ;
}
ul {
	padding-inline-start: 1rem ;
    font-size: 0.9rem ;
    font-weight: 100 !important ;
    line-height: 1.2rem ;
}
ul li {
	margin-bottom: 0.3rem ;
}
._list {
	background: var(--lgrey) ;
	box-shadow: 0px 0px 0px 1px var(--border) inset ;
    border-radius: calc(9px * var(--rad_mult)) ;
    corner-shape: squircle ;
	box-sizing: border-box ;
	display: flex ;
	flex-direction: column ;
	row-gap: 5px ;
	padding: 5px ;
}
._list > * { margin: 0px ; }
input[type = 'checkbox'] {
    height: 28px ;
    min-width: 49px ;
    border: 0px ;
    border-radius: calc(9px * var(--rad_mult)) ;
	corner-shape: squircle ;
    appearance: none ;
    background: var(--border) ;
    vertical-align: middle ;
    margin: 0px ;
    outline: 0px ;
    transition: background 0.21s ;
    cursor: pointer ;

}
input[type = 'checkbox']:before {
    content: '' ;
    height: 22px ;
    width: 24px ;
    display: block ;
    margin: 3px ;
    background: #fefeff ;
    border-radius: calc(5px * var(--rad_mult)) ;
    box-shadow: 0px 0px 4px 0px #b8b8c3 ;
	corner-shape: squircle ;
    transition: margin-left 0.21s ;
}
._label input[type = 'checkbox'] { margin-left: auto ; }
input[type = 'checkbox']:after { content: '' ; position: absolute ; height: 100% ; width: 100% ; top: 0px ; left: 0px ; background: #0000 ; }
input[type = 'checkbox']:checked { background: #1878ed ; }
input[type = 'checkbox']:checked:before { margin-left: 22px ; }
input[type = 'range'] {
    width: 100% ;
    appearance: none ;
    padding-top: 11px ;
    margin-top: 24px ;
    background: linear-gradient(90deg , #09090a45 1px , transparent 1px) center -21px / 9% repeat-x , 
        linear-gradient(var(--black) , var(--black)) center 20px / 100% 3px no-repeat ;
    position: relative ;
}
input[type = 'range']:after { content: attr(max) ; right: 0px ; }
input[type = 'range']:before { content: attr(min) ; }
input[type = 'range']:after , input[type = 'range']:before { position: absolute ; color: var(--darkcolor) ; top: -11px ; }
input[type = 'range']::-webkit-slider-runnable-track {


}
input[type = 'range']::-webkit-slider-thumb {
    appearance: none ;
    background: #1878ed;
    width: 21px ; 
    height: 21px ;
    border-radius: 5px ;
    cursor: pointer ;

}
input[type = 'range']::-moz-range-track {
    
}
input[type = 'range']::-moz-range-thumb {

}
._radio_ctn { margin-top: 9px ; }
._radio_ctn input[type = 'radio'] {
    appearance: none ;
    height: 41px ;
    background: #fefeff11 ;
    text-align: center ;
    line-height: 41px ;
    font-size: 16px ;
    border-radius: 9px ;
    cursor: pointer ;
    flex: 1 1 auto ;

}
._radio_ctn input[type = 'radio']:checked { background: #1a74ec ; }
._radio_ctn input[type = 'radio']:after { content: attr(_ctn) ; }
._radio_ctn input[type = 'radio']:first-child { margin-left: 0px ; }
._radio_ctn input[type = 'radio']:last-child { margin-right: 0px ; }
._input_ctn input , select , select { 
    appearance: none ;
    display: block ; 
    height: 47px ;
    width: 100% ;
    box-sizing: border-box ;
    border-radius: calc(7px * var(--rad_mult)) ;
    corner-shape: squircle ;
    outline: transparent ;
    outline-width: 0px ;
    font-size: 1.17rem ;
	line-height: 47px ;
	padding: 0px 0.5rem ;
    border: 0px ;
    

}
._input_placeholder {
    height: 47px ;
	width: fit-content ;
    position: absolute ;
    inset: 0px ;
    color: #7a7980 ;
    font-size: 1rem ;
    line-height: 47px ;
    transition: 0.21s ;
	padding: 0px 0.5rem ;
	box-sizing: border-box ;
    pointer-events: none ;
	transition: right 0.41s ;
}
._input_ctn input:-webkit-autofill { box-shadow: 0px 0px 0px 1px var(--border) inset , 0px 0px 0px 31px var(--lgrey) inset ; }
._input_ctn input:not(:placeholder-shown) ~._input_placeholder ,
._input_ctn input:focus-within ~._input_placeholder , ._input_ctn input:-webkit-autofill ~._input_placeholder {
    inset: 0px 0.5rem 0px auto ;
    font-size: 1rem ;

}
._input_ctn input.disabled { opacity: 0.7 ; background: var(--dkgrey) ; pointer-events: none ; }
._input_ctn.lb { overflow: visible ; }
._input_ctn.lb input { height: 100% ; padding: 0px ; border: none ; }
._input_ctn.lb ._input_placeholder { top: 0px ; text-align: left ; }
._input_ctn.lb input:not(:placeholder-shown) ~._input_placeholder, ._input_ctn.lb input:focus-within ~._input_placeholder, ._input_ctn.lb input:-webkit-autofill ~._input_placeholder {
    top: -21px ;

}
._input_ctn.lb .sb._abs { right: 5px ; }
._input_ctn.lb:has(.sb._abs) { padding-right: 51px ; }
._black input ,
._black select , ._slate select{ background: var(--slate) !important ; color: var(--lightcolor) ; box-shadow: 0px 0px 0px 1px #2d2d2e inset ; }
input[type = 'email'] { text-transform: lowercase ; } 

textarea { height: 211px ; width: 100% ; resize: none ; border: none ; padding: 11px ; box-sizing: border-box ; border-radius: 11px ; font-size: 1rem ; }
select ,
::picker(select) { appearance: base-select ; }
select { 
	background-image: url(media/_icon/chevron-down-outline.svg) ;
	background-position: calc(100% - 0.5rem) center ;
	background-size: 21px ;
	background-repeat: no-repeat ;
	color: var(--darkcolor) ;
	position: relative ;
}
select:open { border-bottom-left-radius: 0px !important ; border-bottom-right-radius: 0px !important ; }
select::picker-icon { content: '' ; }
select::picker(select) , yb-select .drop_opt {
	border: none ;
	width: anchor-size(width) ;
	inline-size: anchor-size(inline) ;
	margin-top: -1px ;
    max-height: 241px ;
    border: 1px solid #cacbce ;
    border-radius: 0px 0px 14px 14px ;
    background: var(--dkgrey) ;
    overflow-y: auto ;
    z-index: 3 ;
}
._black select::picker(select) , ._black yb-select .drop_opt ,
._slate select::picker(select) , ._slate yb-select .drop_opt { background: var(--slate) ; border: 1px solid #2d2d2e ; color: var(--lightcolor) ; }
optgroup[label] {    
	font-size: 1.1rem ;
    text-align: center ;
    background: var(--silver) ;
    line-height: 34px ;
    letter-spacing: -0.04rem ;
    border-bottom: 1px solid var(--border) ;
}
option::checkmark { content: '' ; }
option , yb-select .drop_opt > div {
    height: 37px ; 
    line-height: 37px ; 
	font-size: 1rem ;
    padding: 0px 0.5rem ; 
    cursor: pointer ; 
    box-sizing: border-box ;
    text-overflow: ellipsis ;
    white-space: nowrap ;
    overflow: hidden ;
}
option { background-color: var(--dkgrey) ; letter-spacing: normal ; font-weight: 300 ; padding: 0px ; }
._black option , ._slate option { background-color: var(--black) ; }
option:hover , yb-select .drop_opt > div:hover { background-color: #09090a07 !important ; } 
._breadcrumb {

}
._breadcrumb > div {
    flex: 1 ;
    display: flex ;
    align-items: center ;
    text-align: center ;
    padding: 1rem 0.8rem 2.5rem 1.2rem ;
    clip-path: polygon(0 0 , calc(100% - 1rem) 0% , 100% 50% , calc(100% - 1rem) 100%, 0 100% , 1rem 50%) ;
    box-sizing: border-box ;
}
._breadcrumb > div:after {
    content: '01' ;
    height: 1.5rem ;
    width: auto ;
    position: absolute ;
    text-align: center ;
    inset: auto 0px 0px 0px ;
    margin: auto ;
    padding: 0px 0.5rem ;
    box-sizing: border-box ;
    background: var(--main) ;
}
._breadcrumb > div:nth-child(2):after { content: '02' ; }
._breadcrumb > div:nth-child(3):after { content: '03' ; }
._breadcrumb > div:nth-child(4):after { content: '04' ; }
._breadcrumb > div:nth-child(5):after { content: '05' ; }

yb-select { z-index: 2 ; }
yb-select .drop_opt { 
	top: 100% ; 
	width: 100% !important ;
    margin-top: -14px ;
	padding-top: 14px ;
	display: none ; 
}
yb-select > ._input_ctn { z-index: 4 ; }
yb-select[ck = '0'] input { box-shadow: 0px 0px 0px 2px #ff604f inset ; }
yb-select._active .drop_opt { display: block ; }
yb-switch {
    width: auto ;
    display: flex ;
    padding: 5px ;
    
    box-shadow: 0px 0px 0px 1px var(--border) inset ;
    background: var(--white) ;
    border-radius: calc(9px * var(--rad_mult)) ;
	corner-shape: squircle ;
    box-sizing: border-box ;
    overflow: hidden ;
    z-index: 1 ;
}
._black yb-switch , ._slate yb-switch { background: var(--slate) ; }
yb-switch div {
    width: auto ;
    flex: 1 1 auto ;
    text-align: center ;
    font-size: 16px ;
    padding: 0px 11px ;
    line-height: 37px ;
    cursor: pointer ;
    transition: color 0.21s ;
	
}
yb-switch div.active { color: var(--lightcolor) ; }
yb-switch ._slider {
    height: calc(100% - 10px) ;
    width: 0px ;
    background: var(--black) ;
    /*  box-shadow: 0px 14px 21px #d0d0d4 , 0px 0px 0px 1px #b8b8c3 inset ; */
    left: 4px ;
    border-radius: calc(7px * var(--rad_mult)) ;
	corner-shape: squircle ;
    z-index: -1 ;
    
    transition: left 0.21s , width 0.21s ;
}
._black yb-switch ._slider , ._slate yb-switch ._slider { box-shadow: 0px 0px 0px 2px #424244 inset , 0px 4px 7px 1px #0f0f0f , 0px 4px 7px 1px #565658 inset ; }
/*		slider		*/
yb-slider {
    width: auto ;
    display: flex ;
    padding: 5px ;
    
    box-shadow: 0px 0px 0px 1px var(--border) inset ;
    background: var(--white) ;
    border-radius: calc(9px * var(--rad_mult)) ;
	corner-shape: squircle ;
	container-type: inline-size ;
    box-sizing: border-box ;
    overflow: hidden ;
	touch-action: none ;
    z-index: 1 ;
}
yb-slider:after {
	content: '' ;
	height: 100% ;
	width: 100% ;
	position: absolute ;
	inset: 0px ;
	background: transparent ;
	cursor: grab ;
	z-index: 4 ;
}
yb-slider ._slider {
    width: max-content ;
	transition: transform 0.31s ease-out ; 
	column-gap: 5px ;
	align-items: flex-start ;
    will-change: transform ;
    transition: transform 0.31s ;
	touch-action: none ;
}
yb-slider ._slider > div {
	height: auto ;
	aspect-ratio: 2 / 1 ;
	flex-shrink: 0 ;
    flex: 1 1 auto ;
    text-align: center ;
    font-size: 16px ;
    transition: color 0.21s , transform 0.41s ;
}
yb-slider ._slider > div.active { color: var(--lightcolor) ; z-index: 2 ; }
yb-slider ._slider > div:not(.active) { /*transform: matrix(0.94 , 0 , 0 , 0.94 , 0 , 0) ;*/ }
yb-slider ._slider > div.active + div { }
yb-slider ._slider > div:has(+ .active) { }
/*		animate		*/
yb-animate { height: 1em ; overflow: hidden ; }
yb-animate > div { 
    height: 1em ;
    width: auto ; 
    display: inline-block ; 
    line-height: 1em ;
    vertical-align: top ;

    transform: scaleY(0) ;
    transform-origin: 50% 100% ;
    opacity: 0 ;
    transition: transform 0.31s , opacity 0.31s ;
    
}
yb-animate > div._AN_SPACE { width: 0.4ch ; }
yb-animate._ready > div {
    transform: scaleY(1) ;
    opacity: 1 ;
    transform-origin: 50% 0% ;
    
}

._glass {
    background-color: #09090a7d ;
    backdrop-filter: blur(19px) saturate(1.5) ;
    box-shadow: 0px 0px 0px 1px #fefeff2b inset ,             
        0px 0px 0px 0px #fefeff70 inset ,             
        3px 2px 1px -3px inset #fefeff ,             
        -3px -2px 1px -3px inset #fefeff ;
    color: var(--lightcolor) ;

}
._light_glass , ._light_shadow {
    box-shadow: 0px 0px 0px 1px #47474a2b inset ,             
        0px 0px 0px 0px #47474a70 inset ,             
        3px 2px 1px -3px inset #0e0e0e ,             
        -3px -2px 1px -3px inset #0e0e0e ;
    
}
._light_glass { background: #fefeff69 ; backdrop-filter: blur(19px) saturate(1.5) ; color: var(--darkcolor) !important ; }
._page , dialog {
    height: 491px ;
    width: 341px ;
    max-width: 91vw ;
    padding: 1.5rem ;
    border-radius: calc(17px * var(--rad_mult)) ;
	corner-shape: squircle ;
    box-shadow: 0px 4px 43px -18px #09090a21 , 0px 0px 0px 1px var(--border) inset ;
    color: var(--lightcolor) ;
    
}
._btn {
    height: 64px ;
    position: absolute ;
    inset: auto 0px 0px 0px ;
    box-sizing: border-box ;
    display: flex ;
    padding: 0px 1rem ;

}
._btn._fit_h { display: block ; inset: auto 0px 1rem 0px ; }
.lb , .sb , ._cel {
    height: 47px ;
    box-sizing: border-box ;
    padding: 0px 17px ;
    line-height: 47px ;
    text-align: center ;
    font-weight: 400 ;
    font-size: 1.1rem ;
    border-radius: calc(9px * var(--rad_mult)) ;
    corner-shape: squircle ;
    transition: background 0.41s , box-shadow 0.41s , color 0.41s ;
    display: block ;
    cursor: pointer ;
    border: none ;
    
}
.sb { height: 37px ; min-width: 37px ; width: auto ; padding: 0px 13px ; line-height: 37px ; font-size: 1.1rem ; border-radius: calc(7px * var(--rad_mult)) ; }
.lb.__main , .sb.__main { 
	background: linear-gradient(
		120deg ,
		#282828 50% , 
		hsl(from var(--main) calc(h + 15) s calc(l + 7)) , 
		var(--main) ,
		var(--main)
	) 100% 0px / 300% ;
	box-shadow: 0px 0px 0px 1px var(--main-border) inset ;
	color: var(--lightcolor) ; 
}
.lb._warn , .sb._warn { box-shadow: 0px 0px 0px 1px #ff8962 inset ; }
.lb.__main.disabled , .sb.__main.disabled { box-shadow: 0px 0px 0px 2px #090909 inset ; }
.lb._black , .sb._black , yb-switch ._slider { 
	box-shadow: 0px 0px 0px 2px #424244 inset , 0px 4px 7px 1px var(--border) , 0px 4px 7px 1px #919296 inset ;
}
._black .lb._black , ._black .sb._black , 
._slate .lb._black , ._slate .sb._black { 
	box-shadow: 0px 0px 0px 1px #2e2e2e inset, 0px 4px 4px 0px #313131 inset ;
}
.lb.disabled , .sb.disabled , a.disabled , yb-switch > div.disabled , ._label.disabled { pointer-events: none ; background-position: 0px 0px ; opacity: 0.7 ; }
.lb[data-tag] { text-align: left ; padding-right: 0px ; }
.lb[data-tag]:before { 
	content: attr(data-tag) ; 
    height: 37px ;
    float: right ;
    margin: 5px ;
    padding: 0px 0.5rem 0px 0.5rem ;
	background-color: var(--dkgrey) !important ;
    line-height: 37px ;
    border-radius: 7px ;
}
.lb._black[data-tag]:before ,
.lb._slate[data-tag]:before { background-color: var(--darkcolor) !important ; }

.ltab { appearance: none ; height: auto ; width: calc(50% - 4.5px) ; aspect-ratio: 1 / 1 ; padding-top: 14px ; line-height: 21px ; box-shadow: 0px 0px 0px 2px var(--main) inset ; transition: box-shadow 0.41s ; }
.ltab[_label]:after {
    content: attr(_label) ;
    height: 39px ;
    width: calc(100% - 34px) ;
    position: absolute ;
    background: var(--dkgrey) ;
    inset: auto 17px 13px 17px ;
    line-height: 39px ;
    font-size: 1.1rem ;
    border-radius: 11px ;

}
._continue { flex: 1 ; }
.sb svg , .lb svg , a > svg { height: 47% ; margin-right: 4px ; vertical-align: middle ; }
.lb svg { margin-right: 9px ; }
.sb._ico { width: 37px ; }
.lb._ico { width: 47px ; }
.sb.__icon , .sb.__logo { background: url(_icon.svg) center left / auto 100% no-repeat ; }
.sb.__icon { width: 39px ; box-shadow: none ; }
.lb.__logo { font-size: 1.5rem ; font-weight: 800 ; letter-spacing: -0.04rem ; }
.lb:active , .sb:active {
	transform: scale(0.97) ;

}
._uid:after {
    content: attr(data-uid) ;
    position: absolute ;
    inset: 5px ;
    height: calc(100% - 10px) ;
    width: auto ;
    line-height: 2.2 ;
    background: var(--main) ;
    border-radius: calc(6px * var(--rad_mult)) ;
    color: var(--lgrey) ;
    font-weight: 100 ;
    corner-shape: squircle ;
    aspect-ratio: 1 / 1 ;
}



/*		dialog/modal		*/
dialog {
	height: fit-content ;
	position: fixed ;
	border: none ;
	padding: 0px ;
	background: none ;
	inset: 0px ;
}
dialog .modal { height: fit-content ; padding: 1rem ; border-radius: calc(7px * var(--rad_mult)) ; corner-shape: squircle ; }
dialog::backdrop {
	background: color-mix(in srgb , var(--slate) , transparent 30%) ;
    backdrop-filter: blur(7px) ;
}
dialog .cancel:not(.__main) , ._back { max-width: 61px ; font-size: 1.61rem ; background: linear-gradient(45deg, var(--dkgrey) , var(--border)) ; margin-right: 0.5rem ; }
dialog .cancel:not(.__main):before { content: '←' ; }



/*      barre de progression        */
._advc {
    height: 11px ;
    width: 341px ;
    bottom: 31px ;
    padding: 2px ;
    border-radius: 9px ;

}
#_progress {
    height: 100% ;
    width: 0px ;
    background: #1874e9 ;
    transition: width 0.71s ;
    border-radius: 7px ;
    
}



/*      header      */
._head {
    height: 51px ;
    width: max-content ;
    padding: 7px ;
    font-size: 1.1rem ;
    line-height: 37px ;
    border-radius: 11px ;
    top: 14px ;
    z-index: 4 ;

}
._head._logo { width: 144px ; text-indent: 24px ; font-size: 1.8rem ; font-weight: 600 ; color: #1874e9 !important ; background: url(../__static/logo.webp) center left / 21px no-repeat ; }
._head._logo._light_glass { width: 177px ; background-position-x: 19px ; text-indent: 44px ; }

/*		v2		*/
yb-header {
	position: relative ;
	display: flex ;
	padding-top: 1rem ;
	align-items: center ;
	
	transform: matrix(1.3 , 0 , 0 , 1.3 , 0 , -91) ;
	transition: transform 0.71s 0.14s ;
	z-index: 9 ;
}
body._ready yb-header { transform: matrix(1 , 0 , 0 , 1 , 0 , 0) ; }
yb-header .head_links {
	display: flex ;
	width: fit-content ;
	column-gap: 1rem ;
	inset: 0px ;
	margin: auto ;
}
yb-header .account_ctn {
	width: fit-content ;
}
yb-header .text_logo {
	box-shadow: none !important ;
	font-size: 1.4rem ;
    font-weight: 500 ;
    letter-spacing: -0.1rem ;
}
body.hide_header yb-header .head_links , 
body.hide_header yb-header .account_ctn 
{ display: none ; }
body.hide_header yb-header .text_logo { margin: 0px auto !important ; }
yb-header._sticky {
	top: 0px ;
	background: linear-gradient(var(--lgrey) 40% , transparent) ;
}
body.__dktheme yb-header._sticky , ._black yb-header._sticky , ._slate yb-header._sticky {
	background: linear-gradient(var(--slate) 40% , transparent) ;
}




/*      pannel      */
._head._right { right: var(--__dym) ; }
._head._left { left: var(--__dym) ; }
._pannel {
    height: 100% ;
    flex: 1 ;
    
}
#_main_title { font-size: 2.1rem ; letter-spacing: -0.14rem ; }
#_main_title > div { font-weight: 400 ; }
/*      layout pannel partenaire & client       */
#_section_ctn { height: 100% ; overflow: hidden ; overflow-y: auto ; overscroll-behavior: none ; }
#_navigation_ctn { 
    width: calc(var(--__dym) + 48px + 1rem) ;
    padding: 1rem 1rem 0px var(--__dym) ; 
    border-right: 1px solid var(--border) ; 
}
#_navigation_ctn ._btn { padding: 0px 1rem 1rem var(--__dym) ; }
._section_content { 
    min-height: calc(100% - 195px) ;
    padding: 1rem 3rem 1rem 3rem ;
    
    /*border-top: 1px solid var(--border) ;
      box-shadow: 0px 0px 41px -7px #dadade ; */
}
#_navigation_ctn + #_section_ctn ._section_content._gpadding { min-height: 100% ; border-top: none ; padding-left: 1rem !important ; }
#_switch_nav , #_switch_nav_mobile {
    background: url(../__static/media/_icon/menu.svg) center / 71% no-repeat ;
}
#_navigation_ctn .lb { text-align: left ; }

.content.maxi_view #_switch_nav { background-image: url(../__static/media/_icon/close-outline.svg) ; }
.content.maxi_view #_navigation_ctn {
    width: calc(var(--__dym) + 18rem);
}
@media only screen and (min-width: 711px) {
    #_navigation_ctn { 
        width: calc(var(--__dym) + 18rem) ;
    
	}
    #_switch_nav {
        display: none ;
    
	}
}


._block , yb-drop {
    height: auto ;
    padding: 1rem ;
    display: inline-block ;
    vertical-align: top ;
    border-radius: calc(14px * var(--rad_mult)) ;
	corner-shape: squircle ;
    break-inside: avoid ;
    background: var(--white) ;
    box-shadow: 0px 0px 0px 1px var(--border) inset , 0px 5px 14px #e8e8ea ;
}
._block > h3 , ._etape_desc > h3 , yb-drop > h3 { margin: 0px ; font-weight: 300 ; }
._block a:not(:is(.lb , .sb)) { color: var(--main) ; line-height: 31px ; }
._block._black , ._block._slate , yb-drop._black , yb-drop._slate { box-shadow: 0px 0px 0px 1px #2d2d2e inset , 0px 5px 14px var(--black) ; }
yb-drop {
	background: var(--dkgrey) ;
	padding: 1rem ;
	overflow: hidden ;
	cursor: pointer ;
}
yb-drop:before {
	content: '' ;
	height: calc(100% - 0.7rem) ;
	width: calc(100% - 0.7rem) ;
	position: absolute ;
	inset: 0px ;
	margin: auto ;
	border: 1px dashed #b7b7b7 ;
	border-radius: calc(11px * var(--rad_mult)) ;
	box-shadow: 0px 0px 0px -13px var(--slate) inset ;
	corner-shape: squircle ;
}
yb-drop > * { z-index: 1 ; }
yb-drop.active:before { background: color-mix(in srgb , var(--main) 20% , transparent) ; border-color: var(--main) ; z-index: 3 ; }
yb-drop ._list:not(:has(*)) { display: none ; }
yb-drop ._list > ._flex { line-height: 37px ; }
yb-drop ._list > ._flex:not(:last-child) { border-bottom: 1px solid var(--border) ; padding-bottom: 4px ; }
.yb_filename { flex: 1 ; color: var(--main) ; padding-left: 0.5rem ; }
label > input[type = 'file'] { display: none ; }
yb-etape {
    
}
yb-etape .etape_action { display: none ; }
._etape_progress {
    height: 91px ;
    width: 91px ;
    background: conic-gradient(var(--dkgrey) 0% , var(--white) 0%) ;
    border-radius: 91px ;

}
._etape_progress:after {
    content: attr(etape) ;
    height: 81px ;
    width: 81px ;
    position: absolute ;
    inset: 0px ;
    margin: auto ;
    background: var(--white) ;
    text-align: center ;
    font-weight: 600 ;
    line-height: 81px ;
    border-radius: 100% ;
}
._etape_desc { min-height: 104px ; padding: 0px 9px 19px 104px ; }
._etape_desc h2 { margin-top: 0px ; }
/*		phone input		*/
yb-phone { display: flex ; column-gap: 5px ; }
.__COUNTRY_SELECT { width: 107px ; background-color: var(--white) !important ; }
.__COUNTRY_SELECT option { background: url() 0.5rem center / 23px no-repeat ; text-indent: 23px ; }
.__COUNTRY_SELECT option[value = '1'] { background-image: url(../__static/media/_icon/flag/1.svg) ; }
.__COUNTRY_SELECT option[value = '31'] { background-image: url(../__static/media/_icon/flag/31.svg) ; }
.__COUNTRY_SELECT option[value = '32'] { background-image: url(../__static/media/_icon/flag/32.svg) ; }
.__COUNTRY_SELECT option[value = '33'] { background-image: url(../__static/media/_icon/flag/33.svg) ; }
.__COUNTRY_SELECT option[value = '34'] { background-image: url(../__static/media/_icon/flag/34.svg) ; }
.__COUNTRY_SELECT option[value = '39'] { background-image: url(../__static/media/_icon/flag/39.svg) ; }
.__COUNTRY_SELECT option[value = '41'] { background-image: url(../__static/media/_icon/flag/41.svg) ; }
.__COUNTRY_SELECT option[value = '44'] { background-image: url(../__static/media/_icon/flag/44.svg) ; }
.__COUNTRY_SELECT option[value = '45'] { background-image: url(../__static/media/_icon/flag/45.svg) ; }
.__COUNTRY_SELECT option[value = '49'] { background-image: url(../__static/media/_icon/flag/49.svg) ; }




/*		table		*/
table {
	width: 100% ;
	background: var(--lgrey) ;
    border-radius: calc(11px * var(--rad_mult)) ;
    corner-shape: squircle ;
	border-collapse: collapse ;
	border-spacing: 0 ;
	color: var(--darkcolor) ;
    box-shadow: 0px 0px 0px 1px #cbd5e0 ;
	overflow: hidden ;
	--xpadding: 1rem ;
	--ypadding: 5px ;
}
*:has(> table) { container-type: inline-size ; container-name: table ; }

thead , tbody { text-align: left ; }
thead { background: var(--dkgrey) ; }
th , tr:not(:last-child) td { border-bottom: 1px solid #cbd5e0 ; }
tr > :first-child 			{ padding-left	: var(--xpadding) ; }
tr > :last-child 			{ padding-right	: var(--xpadding) ; }
th , td { margin: 0px ; padding: 0px ; }
tr > :last-child { text-align: right ; }
tr th { line-height: 44px ; font-weight: 400 ; text-transform: uppercase ; color: #85848a ; }
tr td { line-height: 49px ; white-space: nowrap ; }
tbody tr:hover { background: #7171812b !important ; }
table._black tbody tr:hover { background: var(--slate) !important ; }
table._black { background: var(--black) ; box-shadow: 0px 0px 0px 1px #424245 ; }
table._black thead { background: var(--slate) ; }
table._black th , table._black tr:not(:last-child) td { border-bottom: 1px solid #424245 ; }
.progress {
    height: 23px ;
    width: 23px ;
    margin: 12px 0px ;
    border-radius: 29px ;
    box-shadow: 0px 0px 0px 2px var(--lgrey) inset ;
    border: 1px solid var(--main) ;
}




@supports (corner-shape: squircle) {
	body { --rad_mult: 2.5 ; }
	
}








.show_tel { display: none ; }
@media only screen and (max-width: 1100px) {
    ._breadcrumb { flex-direction: column ; }
    ._breadcrumb > div {
        clip-path: polygon(0 0 , 51% 1rem , 100% 0 , 100% calc(100% - 1rem) , 50% 100% , 0 calc(100% - 1rem)) ;
        padding: 1.7rem 1rem 1.7rem 3.5rem ;
    }
    ._breadcrumb > div:after {
        width: 2.3rem ;
        height: 100% ;
        inset: 0px auto 0px 0px ;
        display: flex ;
        align-self: center ;
        align-items: center ;

    }

}
@media only screen and (max-width: 710px) {   
    * { --__dym: 1rem !important ; }
    #_navigation_ctn {
        position: fixed ;
        inset: 0px ;
        height: 100% ;
        width: 100vw !important ;
        max-width: 100vw ;
        padding: 1rem var(--__dym) ;
        transition: transform 0.71s ;
        z-index: 14 ;
    }


	.content:not(.maxi_view) #_navigation_ctn .lb svg { margin: 0px 26.5% ; }
	.sb._ico , .lb._ico ,
	.content:not(.maxi_view) #_navigation_ctn .lb { padding: 0px ; border-radius: 9px ; corner-shape: inherit ; }

	.content.maxi_view #_switch_nav { background-image: url(../__static/media/_icon/close-outline.svg) ; }
	.content.maxi_view #_navigation_ctn { width: calc(var(--__dym) + 18rem) ; }
	.content:not(.maxi_view) #_navigation_ctn .lb { font-size: 0px ; }
	.content:not(.maxi_view) #_navigation_ctn .__logo { display: none ; }
    .content:not(.maxi_view) #_navigation_ctn { transform: translateX(-100%) ; }

    #_navigation_ctn + #_section_ctn ._section_content._gpadding { padding-left: var(--__dym) !important ; }

    #_switch_nav { background-image: url(../__static/media/_icon/close-outline.svg) !important ; }
    #_navigation_ctn .lb { font-size: 1.21rem !important ; }
    #_navigation_ctn .lb svg { margin: auto 9px auto auto !important ; }

	yb-header .head_links { display: none ; }
	yb-header .account_ctn { margin-left: auto ; }
}
@media only screen and (max-width: 540px) {   
	.hide_tel { display: none ; }
	.show_tel { display: block ; }
    
    
    ._page._abs , ._page._fxd {
        width: calc(100vw - var(--__dym) * 2) ;
        max-width: none ;
        border-radius: calc(14px * var(--rad_mult)) ;

    }
    ._head._logo { background-size: 17% ; font-size: 0px ; color: transparent ; }
    ._advc { bottom: 13px ; }
}
