*,:before,:after{box-sizing:border-box}*{margin:0}body{-webkit-font-smoothing:antialiased}img,picture,video,canvas,svg{max-width:100%;display:block}input,button,textarea,select{font:inherit}:root{--color-dark:#000;--color-light:#fff;--color-card:#181818;--color-surface-subtle:#f4f4f54d;--scalar:min(1.6vw,1.6vh);--card-index:0;--card-width:calc(40*var(--scalar));--card-height:calc(50*var(--scalar));--ease-in-cubic:cubic-bezier(.55,.055,.675,.19);--ease-out-cubic:cubic-bezier(.215,.61,.355,1);--ease-in-out-cubic:cubic-bezier(.645,.045,.355,1)}.wrapper{left:calc(50vw - (var(--card-width)/2));width:var(--card-width);height:var(--card-height);border-radius:calc(1*var(--scalar));background-color:var(--color-card);position:relative;overflow:hidden}.background{z-index:0;position:absolute;inset:0}.background:after{content:"";pointer-events:none;opacity:.9;background:linear-gradient(#1818184d 0%,#181818 70%);position:absolute;inset:0}.background__images{filter:blur(6rem);grid-template:1fr/1fr;display:grid;position:absolute;inset:0}.background__images img{object-fit:cover;will-change:opacity;width:100%;height:100%;transition:opacity var(--card-enter-duration)var(--ease-out-cubic);grid-area:1/1;transform:scale(1.7)}.logo{top:calc(2.4*var(--scalar));left:calc(2.4*var(--scalar));width:calc(11.3*var(--scalar));z-index:1;position:absolute}.cards{transform:translateX(calc(-1*(var(--card-index)*var(--card-width))));z-index:1;width:fit-content;height:100%;transition:transform var(--card-enter-duration)var(--ease-out-cubic);will-change:transform;align-items:center;display:flex;position:relative}.card{position:relative;overflow:hidden}.card__main{width:var(--card-width);padding-block:calc(3.75*var(--scalar));z-index:2;text-align:center;color:var(--color-light);flex-direction:column;align-items:center;display:flex;position:relative}.card__avatar{margin-bottom:calc(2.1*var(--scalar));border-radius:50%;position:relative}.card--user :is(.card__avatar img){transition:scale var(--card-load-enter-duration)var(--ease-out-cubic);will-change:scale;scale:2}.card--user.active :is(.card__avatar img){scale:1}.card__avatar--small{margin-bottom:calc(1.5*var(--scalar))}.badge{width:calc(4.125*var(--scalar));height:calc(4.125*var(--scalar));position:absolute;bottom:0;left:50%;translate:-50% 50%}.card--user .badge{translate:-50%}@keyframes spin{0%{transform:rotateY(0)}to{transform:rotateY(360deg)}}.flip{width:calc(3*var(--scalar));aspect-ratio:1;perspective:min(62.5rem,calc(62.5*var(--scalar)));position:absolute;bottom:0;left:50%;translate:-50% 50%}.flip__inner{transform-style:preserve-3d;width:100%;height:100%;position:relative}.active .flip__inner{animation:spin calc(1s*var(--time-scale))var(--ease-in-out-cubic)calc(.9s*var(--time-scale))forwards}.flip__face{backface-visibility:visible;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute}.flip__face svg{width:100%;height:100%}.flip__face--back{transform:rotateY(180deg)}.card__image{width:calc(13.1*var(--scalar));height:calc(13.1*var(--scalar));border:calc(.25*var(--scalar))solid var(--color-surface-subtle);border-radius:50%;overflow:hidden}.card__avatar--small .card__image{width:calc(8.8*var(--scalar));height:calc(8.8*var(--scalar))}.card__image img{object-fit:cover;width:100%;height:100%}.card__name{padding-inline:calc(4*var(--scalar));font-family:DM Sans Variable,sans-serif;font-size:calc(2.6*var(--scalar));letter-spacing:-.0043em;font-weight:500;line-height:1.15}.card__name--small{font-size:calc(2.4*var(--scalar))}.card__tags{justify-content:center;align-items:center;gap:calc(.6*var(--scalar));margin-top:calc(1.5*var(--scalar));padding-inline:calc(1.5*var(--scalar));flex-wrap:wrap;display:flex}.card__tag{border-radius:calc(6.875*var(--scalar));color:var(--color-light);font-family:DM Sans Variable,sans-serif;font-size:calc(1.3*var(--scalar));background:#ffffff1a;padding:.4167em .6em;font-weight:500;line-height:1}.card__body{margin-top:calc(.86*var(--scalar));padding-inline:calc(3*var(--scalar));font-family:DM Sans Variable,sans-serif;font-size:calc(1.71*var(--scalar));letter-spacing:-.0043em;font-weight:500;line-height:1.15}@keyframes ticker{to{clip-path:inset(0 0% 0 0)}}.scrubber{z-index:1;opacity:.3;position:absolute;bottom:0;left:0;right:0;overflow:hidden;transform:translateY(12%)}.scrubber svg{will-change:transform;flex-shrink:0;max-width:none;height:100%}.waveform{height:calc(8.4*var(--scalar));display:flex}.waveform--background{--svg-use-color-primary:var(--color-surface-subtle)}.waveform--mask{clip-path:inset(0 100% 0 0);animation:ticker calc(var(--animation-duration)*var(--time-scale))linear forwards;position:absolute;inset:0}.outro{width:var(--card-width);z-index:1;justify-content:center;display:flex;position:absolute;top:50%;left:50%;translate:-50% -50%}.loading-state{background:var(--color-dark);z-index:1000;flex-direction:column;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:fixed;top:0;left:0}.loading-state .brand-logo{margin-bottom:calc(2*var(--scalar))}.loading-spinner{width:calc(3*var(--scalar));height:calc(3*var(--scalar));border:calc(.25*var(--scalar))solid #ffffff1a;border-top:calc(.25*var(--scalar))solid #fff9;border-radius:50%;animation:1s linear infinite loading-spin}@keyframes loading-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.brand-logo{width:calc(23.4375*var(--scalar));height:calc(2.75*var(--scalar))}.animate-fade{transition-property:opacity;transition-duration:var(--card-exit-duration);transition-timing-function:var(--ease-out-cubic);opacity:0;will-change:opacity}.animate-fade.visible{opacity:1;transition-duration:var(--card-enter-duration);transition-timing-function:var(--ease-out-cubic)}.animate-scale{opacity:0;transition-property:opacity,scale;transition-duration:var(--card-exit-duration);transition-timing-function:var(--ease-out-cubic);will-change:opacity,scale;scale:.9}.animate-scale.visible{opacity:1;transition-duration:var(--card-enter-duration);transition-timing-function:var(--ease-out-cubic);scale:1}html{font-size:50%}body{height:100vh;color:var(--color-light);background-color:var(--color-dark);place-items:center start;font-family:Open Sans Variable,sans-serif;display:flex;overflow:hidden}
/*$vite$:1*/