/* Tailwind CSS v2.2.19 | MIT License | https://tailwindcss.com */
/* 基础重置和默认样式 */
@tailwind base;

/* 自定义组件 */
@tailwind components;

/* 实用工具类 */
@tailwind utilities;

/* 自定义工具类 */
@layer utilities {
  .content-auto {
    content-visibility: auto;
  }
  .text-gradient {
    background-clip: text;
    color: transparent;
    background-image: linear-gradient(to right, var(--primary), var(--secondary));
  }
  .bg-gradient-primary {
    background-image: linear-gradient(to right, var(--primary), var(--secondary));
  }
  .bg-gradient-light {
    background-image: linear-gradient(to right, #EFF6FF, #F5F3FF);
  }
  .animate-float {
    animation: float 6s ease-in-out infinite;
  }
  .card-hover {
    transition: all 0.3s ease;
  }
  .card-hover:hover {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    transform: translateY(-4px);
  }
}

@keyframes float {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-20px);
  }
}

/* 基础样式重置 */
*,::before,::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e2e8f0}
::before,::after{--tw-content:''}
html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"}
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-size:1em}
small{font-size:80%}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sub{bottom:-0.25em}
sup{top:-0.5em}
table{text-indent:0;border-color:inherit;border-collapse:collapse}
button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:inherit;margin:0;padding:0}
button,select{text-transform:none}
button,[type='button'],[type='reset'],[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}
textarea{resize:vertical}
input::placeholder,textarea::placeholder{opacity:1;color:#a0aec0}
[role='button'],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}

/* 颜色变量 */
:root{--primary:#3B82F6;--secondary:#8B5CF6;--accent:#F472B6;--success:#10B981;--warning:#F59E0B;--error:#EF4444;--info:#3B82F6;--gray-50:#F9FAFB;--gray-100:#F3F4F6;--gray-200:#E5E7EB;--gray-300:#D1D5DB;--gray-400:#9CA3AF;--gray-500:#6B7280;--gray-600:#4B5563;--gray-700:#374151;--gray-800:#1F2937;--gray-900:#111827;}

/* 背景颜色 */
.bg-gray-50{background-color:var(--gray-50)}
.bg-gray-100{background-color:var(--gray-100)}
.bg-gray-200{background-color:var(--gray-200)}
.bg-gray-300{background-color:var(--gray-300)}
.bg-gray-400{background-color:var(--gray-400)}
.bg-gray-500{background-color:var(--gray-500)}
.bg-gray-600{background-color:var(--gray-600)}
.bg-gray-700{background-color:var(--gray-700)}
.bg-gray-800{background-color:var(--gray-800)}
.bg-gray-900{background-color:var(--gray-900)}
.bg-white{background-color:white}
.bg-black{background-color:black}
.bg-transparent{background-color:transparent}

/* 文本颜色 */
.text-gray-50{color:var(--gray-50)}
.text-gray-100{color:var(--gray-100)}
.text-gray-200{color:var(--gray-200)}
.text-gray-300{color:var(--gray-300)}
.text-gray-400{color:var(--gray-400)}
.text-gray-500{color:var(--gray-500)}
.text-gray-600{color:var(--gray-600)}
.text-gray-700{color:var(--gray-700)}
.text-gray-800{color:var(--gray-800)}
.text-gray-900{color:var(--gray-900)}
.text-white{color:white}
.text-black{color:black}

/* 字体大小 */
.text-xs{font-size:0.75rem;line-height:1rem}
.text-sm{font-size:0.875rem;line-height:1.25rem}
.text-base{font-size:1rem;line-height:1.5rem}
.text-lg{font-size:1.125rem;line-height:1.75rem}
.text-xl{font-size:1.25rem;line-height:1.75rem}
.text-2xl{font-size:1.5rem;line-height:2rem}
.text-3xl{font-size:1.875rem;line-height:2.25rem}
.text-4xl{font-size:2.25rem;line-height:2.5rem}
.text-5xl{font-size:3rem;line-height:1}
.text-6xl{font-size:3.75rem;line-height:1}
.text-7xl{font-size:4.5rem;line-height:1}
.text-8xl{font-size:6rem;line-height:1}
.text-9xl{font-size:8rem;line-height:1}

/* 字体粗细 */
.font-thin{font-weight:100}
.font-extralight{font-weight:200}
.font-light{font-weight:300}
.font-normal{font-weight:400}
.font-medium{font-weight:500}
.font-semibold{font-weight:600}
.font-bold{font-weight:700}
.font-extrabold{font-weight:800}
.font-black{font-weight:900}

/* 间距 */
.m-0{margin:0}
.m-1{margin:0.25rem}
.m-2{margin:0.5rem}
.m-3{margin:0.75rem}
.m-4{margin:1rem}
.m-5{margin:1.25rem}
.m-6{margin:1.5rem}
.m-8{margin:2rem}
.m-10{margin:2.5rem}
.m-12{margin:3rem}
.m-16{margin:4rem}
.m-20{margin:5rem}
.m-24{margin:6rem}
.m-32{margin:8rem}
.m-auto{margin:auto}

/* 内边距 */
.p-0{padding:0}
.p-1{padding:0.25rem}
.p-2{padding:0.5rem}
.p-3{padding:0.75rem}
.p-4{padding:1rem}
.p-5{padding:1.25rem}
.p-6{padding:1.5rem}
.p-8{padding:2rem}
.p-10{padding:2.5rem}
.p-12{padding:3rem}
.p-16{padding:4rem}
.p-20{padding:5rem}
.p-24{padding:6rem}
.p-32{padding:8rem}

/* 布局 */
.flex{display:flex}
.inline-flex{display:inline-flex}
.grid{display:grid}
.hidden{display:none}
.block{display:block}
.inline-block{display:inline-block}
.table{display:table}
.inline-table{display:inline-table}
.table-cell{display:table-cell}
.table-row{display:table-row}
.table-row-group{display:table-row-group}
.table-header-group{display:table-header-group}
.table-footer-group{display:table-footer-group}
.contents{display:contents}
.list-item{display:list-item}

/* Flex布局 */
.flex-row{flex-direction:row}
.flex-row-reverse{flex-direction:row-reverse}
.flex-col{flex-direction:column}
.flex-col-reverse{flex-direction:column-reverse}
.flex-wrap{flex-wrap:wrap}
.flex-wrap-reverse{flex-wrap:wrap-reverse}
.flex-nowrap{flex-wrap:nowrap}
.justify-start{justify-content:flex-start}
.justify-end{justify-content:flex-end}
.justify-center{justify-content:center}
.justify-between{justify-content:space-between}
.justify-around{justify-content:space-around}
.justify-evenly{justify-content:space-evenly}
.items-start{align-items:flex-start}
.items-end{align-items:flex-end}
.items-center{align-items:center}
.items-baseline{align-items:baseline}
.items-stretch{align-items:stretch}

/* Grid布局 */
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}
.grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}
.grid-cols-7{grid-template-columns:repeat(7,minmax(0,1fr))}
.grid-cols-8{grid-template-columns:repeat(8,minmax(0,1fr))}
.grid-cols-9{grid-template-columns:repeat(9,minmax(0,1fr))}
.grid-cols-10{grid-template-columns:repeat(10,minmax(0,1fr))}
.grid-cols-11{grid-template-columns:repeat(11,minmax(0,1fr))}
.grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}

/* 响应式断点 */
@media (min-width: 640px){
  .sm\\:block{display:block}
  .sm\\:hidden{display:none}
  .sm\\:flex{display:flex}
  .sm\\:grid{display:grid}
  .sm\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (min-width: 768px){
  .md\\:block{display:block}
  .md\\:hidden{display:none}
  .md\\:flex{display:flex}
  .md\\:grid{display:grid}
  .md\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .md\\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
}

@media (min-width: 1024px){
  .lg\\:block{display:block}
  .lg\\:hidden{display:none}
  .lg\\:flex{display:flex}
  .lg\\:grid{display:grid}
  .lg\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lg\\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .lg\\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
}

@media (min-width: 1280px){
  .xl\\:block{display:block}
  .xl\\:hidden{display:none}
  .xl\\:flex{display:flex}
  .xl\\:grid{display:grid}
  .xl\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .xl\\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .xl\\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .xl\\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}
  .xl\\:grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}
}

/* 定位 */
.static{position:static}
.fixed{position:fixed}
.absolute{position:absolute}
.relative{position:relative}
.sticky{position:sticky}
.top-0{top:0}
.right-0{right:0}
.bottom-0{bottom:0}
.left-0{left:0}
.z-0{z-index:0}
.z-10{z-index:10}
.z-20{z-index:20}
.z-30{z-index:30}
.z-40{z-index:40}
.z-50{z-index:50}

/* 边框 */
.border{border-width:1px}
.border-0{border-width:0}
.border-2{border-width:2px}
.border-4{border-width:4px}
.border-8{border-width:8px}
.border-t{border-top-width:1px}
.border-r{border-right-width:1px}
.border-b{border-bottom-width:1px}
.border-l{border-left-width:1px}
.rounded{border-radius:0.25rem}
.rounded-sm{border-radius:0.125rem}
.rounded-md{border-radius:0.375rem}
.rounded-lg{border-radius:0.5rem}
.rounded-xl{border-radius:0.75rem}
.rounded-2xl{border-radius:1rem}
.rounded-3xl{border-radius:1.5rem}
.rounded-full{border-radius:9999px}

/* 阴影 */
.shadow-sm{box-shadow:0 1px 2px 0 rgba(0,0,0,0.05)}
.shadow{box-shadow:0 1px 3px 0 rgba(0,0,0,0.1),0 1px 2px 0 rgba(0,0,0,0.06)}
.shadow-md{box-shadow:0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06)}
.shadow-lg{box-shadow:0 10px 15px -3px rgba(0,0,0,0.1),0 4px 6px -2px rgba(0,0,0,0.05)}
.shadow-xl{box-shadow:0 20px 25px -5px rgba(0,0,0,0.1),0 10px 10px -5px rgba(0,0,0,0.04)}
.shadow-2xl{box-shadow:0 25px 50px -12px rgba(0,0,0,0.25)}
.shadow-inner{box-shadow:inset 0 2px 4px 0 rgba(0,0,0,0.06)}
.shadow-none{box-shadow:none}

/* 变换 */
.transform{transform:translateZ(0)}
.transform-none{transform:none}
.scale-95{transform:scale(0.95)}
.scale-100{transform:scale(1)}
.scale-105{transform:scale(1.05)}
.scale-110{transform:scale(1.1)}
.scale-125{transform:scale(1.25)}
.scale-150{transform:scale(1.5)}

/* 过渡 */
.transition{transition-property:background-color,border-color,color,fill,stroke,opacity,box-shadow,transform}
.transition-colors{transition-property:background-color,border-color,color,fill,stroke}
.transition-opacity{transition-property:opacity}
.transition-transform{transition-property:transform}
.transition-none{transition-property:none}
.duration-75{transition-duration:75ms}
.duration-100{transition-duration:100ms}
.duration-150{transition-duration:150ms}
.duration-200{transition-duration:200ms}
.duration-300{transition-duration:300ms}
.duration-500{transition-duration:500ms}
.duration-700{transition-duration:700ms}
.duration-1000{transition-duration:1000ms}

/* 其他工具类 */
.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.overflow-hidden{overflow:hidden}
.overflow-auto{overflow:auto}
.overflow-scroll{overflow:scroll}
.overflow-visible{overflow:visible}
.clearfix:after{content:"";display:table;clear:both}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}
.sr-only-focusable:not(:focus):not(:focus-within){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}
.w-full{width:100%}
.h-full{height:100%}
.min-w-0{min-width:0}
.min-h-0{min-height:0}
.max-w-none{max-width:none}
.max-h-none{max-height:none}
.w-0{width:0}
.h-0{height:0}
.w-1{width:0.25rem}
.h-1{height:0.25rem}
.w-2{width:0.5rem}
.h-2{height:0.5rem}
.w-3{width:0.75rem}
.h-3{height:0.75rem}
.w-4{width:1rem}
.h-4{height:1rem}
.w-5{width:1.25rem}
.h-5{height:1.25rem}
.w-6{width:1.5rem}
.h-6{height:1.5rem}
.w-8{width:2rem}
.h-8{height:2rem}
.w-10{width:2.5rem}
.h-10{height:2.5rem}
.w-12{width:3rem}
.h-12{height:3rem}
.w-16{width:4rem}
.h-16{height:4rem}
.w-20{width:5rem}
.h-20{height:5rem}
.w-24{width:6rem}
.h-24{height:6rem}
.w-32{width:8rem}
.h-32{height:8rem}
.w-40{width:10rem}
.h-40{height:10rem}
.w-48{width:6rem}
.h-48{height:12rem}
.w-56{width:14rem}
.h-56{height:14rem}
.w-64{width:16rem}
.h-64{height:16rem}
.w-auto{width:auto}
.h-auto{height:auto}
.w-screen{width:100vw}
.h-screen{height:100vh}
.w-min{width:min-content}
.w-max{width:max-content}
.w-fit{width:fit-content}
.h-min{height:min-content}
.h-max{height:max-content}
.h-fit{height:fit-content}
.min-w-full{min-width:100%}
.min-h-full{min-height:100%}
.max-w-xs{max-width:20rem}
.max-w-sm{max-width:24rem}
.max-w-md{max-width:28rem}
.max-w-lg{max-width:32rem}
.max-w-xl{max-width:36rem}
.max-w-2xl{max-width:42rem}
.max-w-3xl{max-width:48rem}
.max-w-4xl{max-width:56rem}
.max-w-5xl{max-width:64rem}
.max-w-6xl{max-width:72rem}
.max-w-7xl{max-width:80rem}
.max-w-full{max-width:100%}
.max-h-full{max-height:100%}
.translate-x-0{transform:translateX(0)}
.translate-y-0{transform:translateY(0)}
.translate-x-1{transform:translateX(0.25rem)}
.translate-y-1{transform:translateY(0.25rem)}
.translate-x-2{transform:translateX(0.5rem)}
.translate-y-2{transform:translateY(0.5rem)}
.translate-x-3{transform:translateX(0.75rem)}
.translate-y-3{transform:translateY(0.75rem)}
.translate-x-4{transform:translateX(1rem)}
.translate-y-4{transform:translateY(1rem)}
.translate-x-6{transform:translateX(1.5rem)}
.translate-y-6{transform:translateY(1.5rem)}
.translate-x-8{transform:translateX(2rem)}
.translate-y-8{transform:translateY(2rem)}
.translate-x-10{transform:translateX(2.5rem)}
.translate-y-10{transform:translateY(2.5rem)}
.translate-x-12{transform:translateX(3rem)}
.translate-y-12{transform:translateY(3rem)}
.translate-x-16{transform:translateX(4rem)}
.translate-y-16{transform:translateY(4rem)}
.translate-x-20{transform:translateX(5rem)}
.translate-y-20{transform:translateY(5rem)}
.translate-x-24{transform:translateX(6rem)}
.translate-y-24{transform:translateY(6rem)}
.translate-x-32{transform:translateX(8rem)}
.translate-y-32{transform:translateY(8rem)}
.translate-x-40{transform:translateX(10rem)}
.translate-y-40{transform:translateY(10rem)}
.translate-x-48{transform:translateX(12rem)}
.translate-y-48{transform:translateY(12rem)}
.translate-x-56{transform:translateX(14rem)}
.translate-y-56{transform:translateY(14rem)}
.translate-x-64{transform:translateX(16rem)}
.translate-y-64{transform:translateY(16rem)}
.translate-x-px{transform:translateX(1px)}
.translate-y-px{transform:translateY(1px)}
.-translate-x-0{transform:translateX(0)}
.-translate-y-0{transform:translateY(0)}
.-translate-x-1{transform:translateX(-0.25rem)}
.-translate-y-1{transform:translateY(-0.25rem)}
.-translate-x-2{transform:translateX(-0.5rem)}
.-translate-y-2{transform:translateY(-0.5rem)}
.-translate-x-3{transform:translateX(-0.75rem)}
.-translate-y-3{transform:translateY(-0.75rem)}
.-translate-x-4{transform:translateX(-1rem)}
.-translate-y-4{transform:translateY(-1rem)}
.-translate-x-6{transform:translateX(-1.5rem)}
.-translate-y-6{transform:translateY(-1.5rem)}
.-translate-x-8{transform:translateX(-2rem)}
.-translate-y-8{transform:translateY(-2rem)}
.-translate-x-10{transform:translateX(-2.5rem)}
.-translate-y-10{transform:translateY(-2.5rem)}
.-translate-x-12{transform:translateX(-3rem)}
.-translate-y-12{transform:translateY(-3rem)}
.-translate-x-16{transform:translateX(-4rem)}
.-translate-y-16{transform:translateY(-4rem)}
.-translate-x-20{transform:translateX(-5rem)}
.-translate-y-20{transform:translateY(-5rem)}
.-translate-x-24{transform:translateX(-6rem)}
.-translate-y-24{transform:translateY(-6rem)}
.-translate-x-32{transform:translateX(-8rem)}
.-translate-y-32{transform:translateY(-8rem)}
.-translate-x-40{transform:translateX(-10rem)}
.-translate-y-40{transform:translateY(-10rem)}
.-translate-x-48{transform:translateX(-12rem)}
.-translate-y-48{transform:translateY(-12rem)}
.-translate-x-56{transform:translateX(-14rem)}
.-translate-y-56{transform:translateY(-14rem)}
.-translate-x-64{transform:translateX(-16rem)}
.-translate-y-64{transform:translateY(-16rem)}
.-translate-x-px{transform:translateX(-1px)}
.-translate-y-px{transform:translateY(-1px)}
.rotate-0{transform:rotate(0deg)}
.rotate-1{transform:rotate(1deg)}
.rotate-2{transform:rotate(2deg)}
.rotate-3{transform:rotate(3deg)}
.rotate-6{transform:rotate(6deg)}
.rotate-12{transform:rotate(12deg)}
.rotate-45{transform:rotate(45deg)}
.rotate-90{transform:rotate(90deg)}
.rotate-135{transform:rotate(135deg)}
.rotate-180{transform:rotate(180deg)}
.rotate-225{transform:rotate(225deg)}
.rotate-270{transform:rotate(270deg)}
.rotate-315{transform:rotate(315deg)}
.-rotate-1{transform:rotate(-1deg)}
.-rotate-2{transform:rotate(-2deg)}
.-rotate-3{transform:rotate(-3deg)}
.-rotate-6{transform:rotate(-6deg)}
.-rotate-12{transform:rotate(-12deg)}
.-rotate-45{transform:rotate(-45deg)}
.-rotate-90{transform:rotate(-90deg)}
.-rotate-135{transform:rotate(-135deg)}
.-rotate-180{transform:rotate(-180deg)}
.-rotate-225{transform:rotate(-225deg)}
.-rotate-270{transform:rotate(-270deg)}
.-rotate-315{transform:rotate(-315deg)}
.skew-x-0{transform:skewX(0deg)}
.skew-y-0{transform:skewY(0deg)}
.skew-x-1{transform:skewX(1deg)}
.skew-y-1{transform:skewY(1deg)}
.skew-x-2{transform:skewX(2deg)}
.skew-y-2{transform:skewY(2deg)}
.skew-x-3{transform:skewX(3deg)}
.skew-y-3{transform:skewY(3deg)}
.skew-x-6{transform:skewX(6deg)}
.skew-y-6{transform:skewY(6deg)}
.skew-x-12{transform:skewX(12deg)}
.skew-y-12{transform:skewY(12deg)}
.-skew-x-1{transform:skewX(-1deg)}
.-skew-y-1{transform:skewY(-1deg)}
.-skew-x-2{transform:skewX(-2deg)}
.-skew-y-2{transform:skewY(-2deg)}
.-skew-x-3{transform:skewX(-3deg)}
.-skew-y-3{transform:skewY(-3deg)}
.-skew-x-6{transform:skewX(-6deg)}
.-skew-y-6{transform:skewY(-6deg)}
.-skew-x-12{transform:skewX(-12deg)}
.-skew-y-12{transform:skewY(-12deg)}
.scale-x-0{transform:scaleX(0)}
.scale-y-0{transform:scaleY(0)}
.scale-x-50{transform:scaleX(0.5)}
.scale-y-50{transform:scaleY(0.5)}
.scale-x-75{transform:scaleX(0.75)}
.scale-y-75{transform:scaleY(0.75)}
.scale-x-90{transform:scaleX(0.9)}
.scale-y-90{transform:scaleY(0.9)}
.scale-x-95{transform:scaleX(0.95)}
.scale-y-95{transform:scaleY(0.95)}
.scale-x-100{transform:scaleX(1)}
.scale-y-100{transform:scaleY(1)}
.scale-x-105{transform:scaleX(1.05)}
.scale-y-105{transform:scaleY(1.05)}
.scale-x-110{transform:scaleX(1.1)}
.scale-y-110{transform:scaleY(1.1)}
.scale-x-125{transform:scaleX(1.25)}
.scale-y-125{transform:scaleY(1.25)}
.scale-x-150{transform:scaleX(1.5)}
.scale-y-150{transform:scaleY(1.5)}
.border-gray-50{border-color:var(--gray-50)}
.border-gray-100{border-color:var(--gray-100)}
.border-gray-200{border-color:var(--gray-200)}
.border-gray-300{border-color:var(--gray-300)}
.border-gray-400{border-color:var(--gray-400)}
.border-gray-500{border-color:var(--gray-500)}
.border-gray-600{border-color:var(--gray-600)}
.border-gray-700{border-color:var(--gray-700)}
.border-gray-800{border-color:var(--gray-800)}
.border-gray-900{border-color:var(--gray-900)}
.border-white{border-color:white}
.border-black{border-color:black}
.border-transparent{border-color:transparent}
.border-current{border-color:currentColor}
.opacity-0{opacity:0}
.opacity-5{opacity:0.05}
.opacity-10{opacity:0.1}
.opacity-20{opacity:0.2}
.opacity-25{opacity:0.25}
.opacity-30{opacity:0.3}
.opacity-40{opacity:0.4}
.opacity-50{opacity:0.5}
.opacity-60{opacity:0.6}
.opacity-70{opacity:0.7}
.opacity-75{opacity:0.75}
.opacity-80{opacity:0.8}
.opacity-90{opacity:0.9}
.opacity-95{opacity:0.95}
.opacity-100{opacity:1}
.blur-0{filter:blur(0px)}
.blur-sm{filter:blur(0.125rem)}
.blur{filter:blur(0.25rem)}
.blur-md{filter:blur(0.375rem)}
.blur-lg{filter:blur(0.5rem)}
.blur-xl{filter:blur(0.75rem)}
.blur-2xl{filter:blur(1rem)}
.blur-3xl{filter:blur(1.5rem)}
.invert-0{filter:invert(0%)}
.invert{filter:invert(100%)}
.sepia-0{filter:sepia(0%)}
.sepia{filter:sepia(100%)}
.saturate-0{filter:saturate(0%)}
.saturate-50{filter:saturate(50%)}
.saturate-100{filter:saturate(100%)}
.saturate-150{filter:saturate(150%)}
.saturate-200{filter:saturate(200%)}
.grayscale-0{filter:grayscale(0%)}
.grayscale{filter:grayscale(100%)}
.contrast-0{filter:contrast(0%)}
.contrast-50{filter:contrast(50%)}
.contrast-100{filter:contrast(100%)}
.contrast-150{filter:contrast(150%)}
.contrast-200{filter:contrast(200%)}
.brightness-0{filter:brightness(0%)}
.brightness-50{filter:brightness(50%)}
.brightness-75{filter:brightness(75%)}
.brightness-100{filter:brightness(100%)}
.brightness-125{filter:brightness(125%)}
.brightness-150{filter:brightness(150%)}
.brightness-200{filter:brightness(200%)}
.drop-shadow-sm{filter:drop-shadow(0 1px 1px rgba(0,0,0,0.05))}
.drop-shadow{filter:drop-shadow(0 1px 2px rgba(0,0,0,0.1))}
.drop-shadow-md{filter:drop-shadow(0 4px 3px rgba(0,0,0,0.1))}
.drop-shadow-lg{filter:drop-shadow(0 10px 8px rgba(0,0,0,0.1))}
.drop-shadow-xl{filter:drop-shadow(0 20px 13px rgba(0,0,0,0.1))}
.drop-shadow-2xl{filter:drop-shadow(0 25px 25px rgba(0,0,0,0.15))}
.drop-shadow-none{filter:drop-shadow(none)}
.filter{filter:var(--tw-filter)}
.filter-none{filter:none}
.gap-0{gap:0}
.gap-1{gap:0.25rem}
.gap-2{gap:0.5rem}
.gap-3{gap:0.75rem}
.gap-4{gap:1rem}
.gap-5{gap:1.25rem}
.gap-6{gap:1.5rem}
.gap-8{gap:2rem}
.gap-10{gap:2.5rem}
.gap-12{gap:3rem}
.gap-16{gap:4rem}
.gap-20{gap:5rem}
.gap-24{gap:6rem}
.gap-32{gap:8rem}
.gap-x-0{column-gap:0}
.gap-x-1{column-gap:0.25rem}
.gap-x-2{column-gap:0.5rem}
.gap-x-3{column-gap:0.75rem}
.gap-x-4{column-gap:1rem}
.gap-x-5{column-gap:1.25rem}
.gap-x-6{column-gap:1.5rem}
.gap-x-8{column-gap:2rem}
.gap-x-10{column-gap:2.5rem}
.gap-x-12{column-gap:3rem}
.gap-x-16{column-gap:4rem}
.gap-x-20{column-gap:5rem}
.gap-x-24{column-gap:6rem}
.gap-x-32{column-gap:8rem}
.gap-y-0{row-gap:0}
.gap-y-1{row-gap:0.25rem}
.gap-y-2{row-gap:0.5rem}
.gap-y-3{row-gap:0.75rem}
.gap-y-4{row-gap:1rem}
.gap-y-5{row-gap:1.25rem}
.gap-y-6{row-gap:1.5rem}
.gap-y-8{row-gap:2rem}
.gap-y-10{row-gap:2.5rem}
.gap-y-12{row-gap:3rem}
.gap-y-16{row-gap:4rem}
.gap-y-20{row-gap:5rem}
.gap-y-24{row-gap:6rem}
.gap-y-32{row-gap:8rem}
.snap-none{scroll-snap-type:none}
.snap-x{scroll-snap-type:x var(--tw-snap-strictness)}
.snap-y{scroll-snap-type:y var(--tw-snap-strictness)}
.snap-both{scroll-snap-type:x y var(--tw-snap-strictness)}
.snap-mandatory{--tw-snap-strictness:mandatory}
.snap-proximity{--tw-snap-strictness:proximity}
.snap-start{scroll-snap-align:start}
.snap-end{scroll-snap-align:end}
.snap-center{scroll-snap-align:center}
.snap-align-none{scroll-snap-align:none}
.snap-normal{scroll-snap-stop:normal}
.snap-always{scroll-snap-stop:always}
.select-none{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.select-text{-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text}
.select-all{-webkit-user-select:all;-moz-user-select:all;-ms-user-select:all;user-select:all}
.select-auto{-webkit-user-select:auto;-moz-user-select:auto;-ms-user-select:auto;user-select:auto}
.appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}
.appearance-auto{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}
.break-before-auto{break-before:auto}
.break-before-avoid{break-before:avoid}
.break-before-all{break-before:all}
.break-before-avoid-page{break-before:avoid-page}
.break-before-page{break-before:page}
.break-before-left{break-before:left}
.break-before-right{break-before:right}
.break-before-column{break-before:column}
.break-inside-auto{break-inside:auto}
.break-inside-avoid{break-inside:avoid}
.break-inside-avoid-page{break-inside:avoid-page}
.break-inside-avoid-column{break-inside:avoid-column}
.break-after-auto{break-after:auto}
.break-after-avoid{break-after:avoid}
.break-after-all{break-after:all}
.break-after-avoid-page{break-after:avoid-page}
.break-after-page{break-after:page}
.break-after-left{break-after:left}
.break-after-right{break-after:right}
.break-after-column{break-after:column}
.grid-rows-1{grid-template-rows:repeat(1,minmax(0,1fr))}
.grid-rows-2{grid-template-rows:repeat(2,minmax(0,1fr))}
.grid-rows-3{grid-template-rows:repeat(3,minmax(0,1fr))}
.grid-rows-4{grid-template-rows:repeat(4,minmax(0,1fr))}
.grid-rows-5{grid-template-rows:repeat(5,minmax(0,1fr))}
.grid-rows-6{grid-template-rows:repeat(6,minmax(0,1fr))}
.content-auto{align-content:normal}
.content-start{align-content:flex-start}
.content-end{align-content:flex-end}
.content-center{align-content:center}
.content-between{align-content:space-between}
.content-around{align-content:space-around}
.content-evenly{align-content:space-evenly}
.place-content-auto{place-content:normal}
.place-content-start{place-content:start}
.place-content-end{place-content:end}
.place-content-center{place-content:center}
.place-content-between{place-content:space-between}
.place-content-around{place-content:space-around}
.place-content-evenly{place-content:space-evenly}
.place-content-stretch{place-content:stretch}
.place-items-auto{place-items:auto}
.place-items-start{place-items:start}
.place-items-end{place-items:end}
.place-items-center{place-items:center}
.place-items-stretch{place-items:stretch}
.space-x-0 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(0px * var(--tw-space-x-reverse));margin-left:calc(0px * calc(1 - var(--tw-space-x-reverse)))}
.space-x-1 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(0.25rem * var(--tw-space-x-reverse));margin-left:calc(0.25rem * calc(1 - var(--tw-space-x-reverse)))}
.space-x-2 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(0.5rem * var(--tw-space-x-reverse));margin-left:calc(0.5rem * calc(1 - var(--tw-space-x-reverse)))}
.space-x-3 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(0.75rem * var(--tw-space-x-reverse));margin-left:calc(0.75rem * calc(1 - var(--tw-space-x-reverse)))}
.space-x-4 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(1rem * var(--tw-space-x-reverse));margin-left:calc(1rem * calc(1 - var(--tw-space-x-reverse)))}
.space-x-5 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(1.25rem * var(--tw-space-x-reverse));margin-left:calc(1.25rem * calc(1 - var(--tw-space-x-reverse)))}
.space-x-6 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(1.5rem * var(--tw-space-x-reverse));margin-left:calc(1.5rem * calc(1 - var(--tw-space-x-reverse)))}
.space-x-8 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(2rem * var(--tw-space-x-reverse));margin-left:calc(2rem * calc(1 - var(--tw-space-x-reverse)))}
.space-x-10 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(2.5rem * var(--tw-space-x-reverse));margin-left:calc(2.5rem * calc(1 - var(--tw-space-x-reverse)))}
.space-x-12 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(3rem * var(--tw-space-x-reverse));margin-left:calc(3rem * calc(1 - var(--tw-space-x-reverse)))}
.space-x-16 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(4rem * var(--tw-space-x-reverse));margin-left:calc(4rem * calc(1 - var(--tw-space-x-reverse)))}
.space-x-20 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(5rem * var(--tw-space-x-reverse));margin-left:calc(5rem * calc(1 - var(--tw-space-x-reverse)))}
.space-x-24 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(6rem * var(--tw-space-x-reverse));margin-left:calc(6rem * calc(1 - var(--tw-space-x-reverse)))}
.space-x-32 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(8rem * var(--tw-space-x-reverse));margin-left:calc(8rem * calc(1 - var(--tw-space-x-reverse)))}
.space-y-0 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0px * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0px * var(--tw-space-y-reverse))}
.space-y-1 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0.25rem * var(--tw-space-y-reverse))}
.space-y-2 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0.5rem * var(--tw-space-y-reverse))}
.space-y-3 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0.75rem * var(--tw-space-y-reverse))}
.space-y-4 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}
.space-y-5 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.25rem * var(--tw-space-y-reverse))}
.space-y-6 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.5rem * var(--tw-space-y-reverse))}
.space-y-8 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(2rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(2rem * var(--tw-space-y-reverse))}
.space-y-10 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(2.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(2.5rem * var(--tw-space-y-reverse))}
.space-y-12 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(3rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(3rem * var(--tw-space-y-reverse))}
.space-y-16 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(4rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(4rem * var(--tw-space-y-reverse))}
.space-y-20 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(5rem * var(--tw-space-y-reverse))}
.space-y-24 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(6rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(6rem * var(--tw-space-y-reverse))}
.space-y-32 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(8rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(8rem * var(--tw-space-y-reverse))}
.space-x-reverse > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:1}
.space-y-reverse > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:1}
.text-left{text-align:left}
.text-center{text-align:center}
.text-right{text-align:right}
.text-justify{text-align:justify}
.text-start{text-align:start}
.text-end{text-align:end}
.align-baseline{align-items:baseline}
.align-top{align-items:flex-start}
.align-middle{align-items:center}
.align-bottom{align-items:flex-end}
.align-text-top{align-items:text-top}
.align-text-bottom{align-items:text-bottom}
.align-sub{align-items:sub}
.align-super{align-items:super}
.leading-none{line-height:1}
.leading-tight{line-height:1.25}
.leading-snug{line-height:1.375}
.leading-normal{line-height:1.5}
.leading-relaxed{line-height:1.625}
.leading-loose{line-height:2}
.leading-3{line-height:0.75rem}
.leading-4{line-height:1rem}
.leading-5{line-height:1.25rem}
.leading-6{line-height:1.5rem}
.leading-7{line-height:1.75rem}
.leading-8{line-height:2rem}
.leading-9{line-height:2.25rem}
.leading-10{line-height:2.5rem}
.tracking-tighter{letter-spacing:-0.05em}
.tracking-tight{letter-spacing:-0.025em}
.tracking-normal{letter-spacing:0em}
.tracking-wide{letter-spacing:0.025em}
.tracking-wider{letter-spacing:0.05em}
.tracking-widest{letter-spacing:0.1em}
.underline{text-decoration-line:underline}
.overline{text-decoration-line:overline}
.line-through{text-decoration-line:line-through}
.no-underline{text-decoration-line:none}
.decoration-transparent{text-decoration-color:transparent}
.decoration-current{text-decoration-color:currentColor}
.decoration-black{text-decoration-color:black}
.decoration-white{text-decoration-color:white}
.decoration-gray-50{text-decoration-color:var(--gray-50)}
.decoration-gray-100{text-decoration-color:var(--gray-100)}
.decoration-gray-200{text-decoration-color:var(--gray-200)}
.decoration-gray-300{text-decoration-color:var(--gray-300)}
.decoration-gray-400{text-decoration-color:var(--gray-400)}
.decoration-gray-500{text-decoration-color:var(--gray-500)}
.decoration-gray-600{text-decoration-color:var(--gray-600)}
.decoration-gray-700{text-decoration-color:var(--gray-700)}
.decoration-gray-800{text-decoration-color:var(--gray-800)}
.decoration-gray-900{text-decoration-color:var(--gray-900)}
.decoration-0{text-decoration-thickness:0px}
.decoration-1{text-decoration-thickness:1px}
.decoration-2{text-decoration-thickness:2px}
.decoration-4{text-decoration-thickness:4px}
.decoration-8{text-decoration-thickness:8px}
.decoration-auto{text-decoration-thickness:auto}
.decoration-from-font{text-decoration-thickness:from-font}
.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.subpixel-antialiased{-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto}
.font-sans{font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"}
.font-serif{font-family:ui-serif,Georgia,Cambria,"Times New Roman",Times,serif}
.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace}
.font-sans{font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"}
.font-serif{font-family:ui-serif,Georgia,Cambria,"Times New Roman",Times,serif}
.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace}
.italic{font-style:italic}
.not-italic{font-style:normal}
.normal-case{text-transform:none}
.uppercase{text-transform:uppercase}
.lowercase{text-transform:lowercase}
.capitalize{text-transform:capitalize}
.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.overflow-hidden{overflow:hidden}
.overflow-auto{overflow:auto}
.overflow-scroll{overflow:scroll}
.overflow-visible{overflow:visible}
.whitespace-normal{white-space:normal}
.whitespace-nowrap{white-space:nowrap}
.whitespace-pre{white-space:pre}
.whitespace-pre-wrap{white-space:pre-wrap}
.whitespace-pre-line{white-space:pre-line}
.whitespace-break-spaces{white-space:break-spaces}
.text-ellipsis{text-overflow:ellipsis}
.text-clip{text-overflow:clip}
.text-unset{text-overflow:unset}
.hyphens-none{-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}
.hyphens-manual{-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual;hyphens:manual}
.hyphens-auto{-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;hyphens:auto}
.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}
.scrollbar-hide::-webkit-scrollbar{display:none}
.scrollbar-default{-ms-overflow-style:auto;scrollbar-width:auto}
.scrollbar-thin{-ms-overflow-style:auto;scrollbar-width:thin}
.scrollbar-none{-ms-overflow-style:none;scrollbar-width:none}
.scrollbar-none::-webkit-scrollbar{display:none}
.resize-none{resize:none}
.resize-y{resize:vertical}
.resize-x{resize:horizontal}
.resize{resize:both}
.cursor-auto{cursor:auto}
.cursor-default{cursor:default}
.cursor-pointer{cursor:pointer}
.cursor-wait{cursor:wait}
.cursor-text{cursor:text}
.cursor-move{cursor:move}
.cursor-not-allowed{cursor:not-allowed}
.cursor-none{cursor:none}
.cursor-context-menu{cursor:context-menu}
.cursor-help{cursor:help}
.cursor-progress{cursor:progress}
.cursor-cell{cursor:cell}
.cursor-crosshair{cursor:crosshair}
.cursor-vertical-text{cursor:vertical-text}
.cursor-alias{cursor:alias}
.cursor-copy{cursor:copy}
.cursor-no-drop{cursor:no-drop}
.cursor-grab{cursor:grab}
.cursor-grabbing{cursor:grabbing}
.cursor-all-scroll{cursor:all-scroll}
.cursor-col-resize{cursor:col-resize}
.cursor-row-resize{cursor:row-resize}
.cursor-n-resize{cursor:n-resize}
.cursor-e-resize{cursor:e-resize}
.cursor-s-resize{cursor:s-resize}
.cursor-w-resize{cursor:w-resize}
.cursor-ne-resize{cursor:ne-resize}
.cursor-nw-resize{cursor:nw-resize}
.cursor-se-resize{cursor:se-resize}
.cursor-sw-resize{cursor:sw-resize}
.cursor-ew-resize{cursor:ew-resize}
.cursor-ns-resize{cursor:ns-resize}
.cursor-nesw-resize{cursor:nesw-resize}
.cursor-nwse-resize{cursor:nwse-resize}
.cursor-zoom-in{cursor:zoom-in}
.cursor-zoom-out{cursor:zoom-out}
.select-none{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.select-text{-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text}
.select-all{-webkit-user-select:all;-moz-user-select:all;-ms-user-select:all;user-select:all}
.select-auto{-webkit-user-select:auto;-moz-user-select:auto;-ms-user-select:auto;user-select:auto}
.pointer-events-none{pointer-events:none}
.pointer-events-auto{pointer-events:auto}
.visible{visibility:visible}
.invisible{visibility:hidden}
.collapse{visibility:collapse}
.static{position:static}
.fixed{position:fixed}
.absolute{position:absolute}
.relative{position:relative}
.sticky{position:sticky}
.top-0{top:0px}
.right-0{right:0px}
.bottom-0{bottom:0px}
.left-0{left:0px}
.top-1{top:0.25rem}
.right-1{right:0.25rem}
.bottom-1{bottom:0.25rem}
.left-1{left:0.25rem}
.top-2{top:0.5rem}
.right-2{right:0.5rem}
.bottom-2{bottom:0.5rem}
.left-2{left:0.5rem}
.top-3{top:0.75rem}
.right-3{right:0.75rem}
.bottom-3{bottom:0.75rem}
.left-3{left:0.75rem}
.top-4{top:1rem}
.right-4{right:1rem}
.bottom-4{bottom:1rem}
.left-4{left:1rem}
.top-5{top:1.25rem}
.right-5{right:1.25rem}
.bottom-5{bottom:1.25rem}
.left-5{left:1.25rem}
.top-6{top:1.5rem}
.right-6{right:1.5rem}
.bottom-6{bottom:1.5rem}
.left-6{left:1.5rem}
.top-8{top:2rem}
.right-8{right:2rem}
.bottom-8{bottom:2rem}
.left-8{left:2rem}
.top-10{top:2.5rem}
.right-10{right:2.5rem}
.bottom-10{bottom:2.5rem}
.left-10{left:2.5rem}
.top-12{top:3rem}
.right-12{right:3rem}
.bottom-12{bottom:3rem}
.left-12{left:3rem}
.top-16{top:4rem}
.right-16{right:4rem}
.bottom-16{bottom:4rem}
.left-16{left:4rem}
.top-20{top:5rem}
.right-20{right:5rem}
.bottom-20{bottom:5rem}
.left-20{left:5rem}
.top-24{top:6rem}
.right-24{right:6rem}
.bottom-24{bottom:6rem}
.left-24{left:6rem}
.top-32{top:8rem}
.right-32{right:8rem}
.bottom-32{bottom:8rem}
.left-32{left:8rem}
.top-40{top:10rem}
.right-40{right:10rem}
.bottom-40{bottom:10rem}
.left-40{left:10rem}
.top-48{top:12rem}
.right-48{right:12rem}
.bottom-48{bottom:12rem}
.left-48{left:12rem}
.top-56{top:14rem}
.right-56{right:14rem}
.bottom-56{bottom:14rem}
.left-56{left:14rem}
.top-64{top:16rem}
.right-64{right:16rem}
.bottom-64{bottom:16rem}
.left-64{left:16rem}
.top-72{top:18rem}
.right-72{right:18rem}
.bottom-72{bottom:18rem}
.left-72{left:18rem}
.top-80{top:20rem}
.right-80{right:20rem}
.bottom-80{bottom:20rem}
.left-80{left:20rem}
.top-96{top:24rem}
.right-96{right:24rem}
.bottom-96{bottom:24rem}
.left-96{left:24rem}
.top-px{top:1px}
.right-px{right:1px}
.bottom-px{bottom:1px}
.left-px{left:1px}
.top-auto{top:auto}
.right-auto{right:auto}
.bottom-auto{bottom:auto}
.left-auto{bottom:auto}
.-top-0{top:0px}
.-right-0{right:0px}
.-bottom-0{bottom:0px}
.-left-0{left:0px}
.-top-1{top:-0.25rem}
.-right-1{right:-0.25rem}
.-bottom-1{bottom:-0.25rem}
.-left-1{left:-0.25rem}
.-top-2{top:-0.5rem}
.-right-2{right:-0.5rem}
.-bottom-2{bottom:-0.5rem}
.-left-2{left:-0.5rem}
.-top-3{top:-0.75rem}
.-right-3{right:-0.75rem}
.-bottom-3{bottom:-0.75rem}
.-left-3{left:-0.75rem}
.-top-4{top:-1rem}
.-right-4{right:-1rem}
.-bottom-4{bottom:-1rem}
.-left-4{left:-1rem}
.-top-5{top:-1.25rem}
.-right-5{right:-1.25rem}
.-bottom-5{bottom:-1.25rem}
.-left-5{left:-1.25rem}
.-top-6{top:-1.5rem}
.-right-6{right:-1.5rem}
.-bottom-6{bottom:-1.5rem}
.-left-6{left:-1.5rem}
.-top-8{top:-2rem}
.-right-8{right:-2rem}
.-bottom-8{bottom:-2rem}
.-left-8{left:-2rem}
.-top-10{top:-2.5rem}
.-right-10{right:-2.5rem}
.-bottom-10{bottom:-2.5rem}
.-left-10{left:-2.5rem}
.-top-12{top:-3rem}
.-right-12{right:-3rem}
.-bottom-12{bottom:-3rem}
.-left-12{left:-3rem}
.-top-16{top:-4rem}
.-right-16{right:-4rem}
.-bottom-16{bottom:-4rem}
.-left-16{left:-4rem}
.-top-20{top:-5rem}
.-right-20{right:-5rem}
.-bottom-20{bottom:-5rem}
.-left-20{left:-5rem}
.-top-24{top:-6rem}
.-right-24{right:-6rem}
.-bottom-24{bottom:-6rem}
.-left-24{left:-6rem}
.-top-32{top:-8rem}
.-right-32{right:-8rem}
.-bottom-32{bottom:-8rem}
.-left-32{left:-8rem}
.-top-40{top:-10rem}
.-right-40{right:-10rem}
.-bottom-40{bottom:-10rem}
.-left-40{left:-10rem}
.-top-48{top:-12rem}
.-right-48{right:-12rem}
.-bottom-48{bottom:-12rem}
.-left-48{left:-12rem}
.-top-56{top:-14rem}
.-right-56{right:-14rem}
.-bottom-56{bottom:-14rem}
.-left-56{left:-14rem}
.-top-64{top:-16rem}
.-right-64{right:-16rem}
.-bottom-64{bottom:-16rem}
.-left-64{left:-16rem}
.-top-72{top:-18rem}
.-right-72{right:-18rem}
.-bottom-72{bottom:-18rem}
.-left-72{left:-18rem}
.-top-80{top:-20rem}
.-right-80{right:-20rem}
.-bottom-80{bottom:-20rem}
.-left-80{left:-20rem}
.-top-96{top:-24rem}
.-right-96{right:-24rem}
.-bottom-96{bottom:-24rem}
.-left-96{left:-24rem}
.-top-px{top:-1px}
.-right-px{right:-1px}
.-bottom-px{bottom:-1px}
.-left-px{left:-1px}
.z-0{z-index:0}
.z-10{z-index:10}
.z-20{z-index:20}
.z-30{z-index:30}
.z-40{z-index:40}
.z-50{z-index:50}
.z-60{z-index:60}
.z-70{z-index:70}
.z-80{z-index:80}
.z-90{z-index:90}
.z-100{z-index:100}
.z-auto{z-index:auto}
/* 自定义工具类 */
@layer utilities {
  .content-auto {
    content-visibility: auto;
  }
  .bg-gradient-primary {
    background-image: linear-gradient(to right, var(--primary), var(--secondary));
  }
  .bg-gradient-light {
    background-image: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
  }
  .text-gradient {
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    background-image: linear-gradient(to right, var(--primary), var(--secondary));
  }
  .backdrop-blur {
    backdrop-filter: blur(8px);
  }
  .backdrop-blur-sm {
    backdrop-filter: blur(4px);
  }
  .backdrop-blur-md {
    backdrop-filter: blur(12px);
  }
  .backdrop-blur-lg {
    backdrop-filter: blur(16px);
  }
  .backdrop-blur-xl {
    backdrop-filter: blur(24px);
  }
  .backdrop-blur-2xl {
    backdrop-filter: blur(32px);
  }
  .backdrop-blur-none {
    backdrop-filter: blur(0);
  }
  .glass-effect {
    background: rgba(255, 255, 255, 0.25);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.18);
  }
  .card-hover {
    transition: all 0.3s ease;
  }
  .card-hover:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
  }
  .btn-primary {
    background-image: linear-gradient(to right, var(--primary), var(--secondary));
    color: white;
    padding: 0.75rem 1.5rem;
    border-radius: 0.5rem;
    font-weight: 600;
    transition: all 0.3s ease;
    text-decoration: none;
    display: inline-block;
    border: none;
    cursor: pointer;
  }
  .btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 20px -5px rgba(59, 130, 246, 0.3);
  }
  .btn-primary:active {
    transform: translateY(0);
  }
  .btn-secondary {
    background-color: white;
    color: var(--primary);
    padding: 0.75rem 1.5rem;
    border-radius: 0.5rem;
    font-weight: 600;
    transition: all 0.3s ease;
    text-decoration: none;
    display: inline-block;
    border: 2px solid var(--primary);
    cursor: pointer;
  }
  .btn-secondary:hover {
    background-color: var(--primary);
    color: white;
    transform: translateY(-2px);
    box-shadow: 0 10px 20px -5px rgba(59, 130, 246, 0.3);
  }
  .btn-secondary:active {
    transform: translateY(0);
  }
  .nav-link {
    color: var(--gray-600);
    transition: all 0.3s ease;
    font-weight: 500;
    text-decoration: none;
    position: relative;
  }
  .nav-link:hover {
    color: var(--primary);
  }
  .nav-link-active {
    color: var(--primary);
    font-weight: 600;
    text-decoration: none;
    position: relative;
  }
  .nav-link-active::after {
    content: '';
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 100%;
    height: 2px;
    background-image: linear-gradient(to right, var(--primary), var(--secondary));
  }
  .section-padding {
    padding: 5rem 0;
  }
  .container {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 1rem;
  }
  @media (min-width: 640px) {
    .container {
      padding: 0 1.5rem;
    }
  }
  @media (min-width: 1024px) {
    .container {
      padding: 0 2rem;
    }
  }
  .animate-fade-in {
    animation: fadeIn 0.5s ease-in-out;
  }
  @keyframes fadeIn {
    from {
      opacity: 0;
      transform: translateY(20px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  .animate-slide-in {
    animation: slideIn 0.5s ease-in-out;
  }
  @keyframes slideIn {
    from {
      opacity: 0;
      transform: translateX(-20px);
    }
    to {
      opacity: 1;
      transform: translateX(0);
    }
  }
  .animate-bounce-in {
    animation: bounceIn 0.6s ease-out;
  }
  @keyframes bounceIn {
    0% {
      opacity: 0;
      transform: scale(0.3);
    }
    50% {
      opacity: 1;
      transform: scale(1.05);
    }
    70% {
      transform: scale(0.9);
    }
    100% {
      opacity: 1;
      transform: scale(1);
    }
  }
  .animate-pulse {
    animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
  }
  @keyframes pulse {
    0%, 100% {
      opacity: 1;
    }
    50% {
      opacity: 0.5;
    }
  }
  .animate-bounce {
    animation: bounce 1s infinite;
  }
  @keyframes bounce {
    0%, 100% {
      transform: translateY(-25%);
      animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
    }
    50% {
      transform: translateY(0);
      animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
    }
  }
  .animate-spin {
    animation: spin 1s linear infinite;
  }
  @keyframes spin {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(360deg);
    }
  }
  .animate-spin-slow {
    animation: spinSlow 3s linear infinite;
  }
  @keyframes spinSlow {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(360deg);
    }
  }
  .animate-shake {
    animation: shake 0.5s cubic-bezier(.36,.07,.19,.97) both;
  }
  @keyframes shake {
    10%, 90% {
      transform: translate3d(-1px, 0, 0);
    }
    20%, 80% {
      transform: translate3d(2px, 0, 0);
    }
    30%, 50%, 70% {
      transform: translate3d(-4px, 0, 0);
    }
    40%, 60% {
      transform: translate3d(4px, 0, 0);
    }
  }
  .animate-flip {
    animation: flip 0.6s ease-in-out;
  }
  @keyframes flip {
    0% {
      transform: perspective(400px) rotateY(0);
    }
    40% {
      transform: perspective(400px) translateZ(150px) rotateY(-190deg);
    }
    50% {
      transform: perspective(400px) translateZ(150px) rotateY(-190deg);
    }
    80% {
      transform: perspective(400px) rotateY(0);
    }
    100% {
      transform: perspective(400px) rotateY(0);
    }
  }
  .animate-float {
    animation: float 3s ease-in-out infinite;
  }
  @keyframes float {
    0% {
      transform: translateY(0px);
    }
    50% {
      transform: translateY(-10px);
    }
    100% {
      transform: translateY(0px);
    }
  }
  .animate-glow {
    animation: glow 2s ease-in-out infinite alternate;
  }
  @keyframes glow {
    from {
      box-shadow: 0 0 5px rgba(59, 130, 246, 0.4);
    }
    to {
      box-shadow: 0 0 20px rgba(59, 130, 246, 0.8);
    }
  }
  .animate-fade-in-up {
    animation: fadeInUp 0.6s ease-out;
  }
  @keyframes fadeInUp {
    from {
      opacity: 0;
      transform: translate3d(0, 40px, 0);
    }
    to {
      opacity: 1;
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-fade-in-down {
    animation: fadeInDown 0.6s ease-out;
  }
  @keyframes fadeInDown {
    from {
      opacity: 0;
      transform: translate3d(0, -40px, 0);
    }
    to {
      opacity: 1;
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-fade-in-left {
    animation: fadeInLeft 0.6s ease-out;
  }
  @keyframes fadeInLeft {
    from {
      opacity: 0;
      transform: translate3d(-40px, 0, 0);
    }
    to {
      opacity: 1;
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-fade-in-right {
    animation: fadeInRight 0.6s ease-out;
  }
  @keyframes fadeInRight {
    from {
      opacity: 0;
      transform: translate3d(40px, 0, 0);
    }
    to {
      opacity: 1;
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-zoom-in {
    animation: zoomIn 0.6s ease-out;
  }
  @keyframes zoomIn {
    from {
      opacity: 0;
      transform: scale3d(0.3, 0.3, 0.3);
    }
    50% {
      opacity: 1;
    }
    to {
      opacity: 1;
      transform: scale3d(1, 1, 1);
    }
  }
  .animate-zoom-out {
    animation: zoomOut 0.6s ease-out;
  }
  @keyframes zoomOut {
    from {
      opacity: 1;
      transform: scale3d(1, 1, 1);
    }
    50% {
      opacity: 0;
      transform: scale3d(0.3, 0.3, 0.3);
    }
    to {
      opacity: 0;
      transform: scale3d(0.3, 0.3, 0.3);
    }
  }
  .animate-rotate-in {
    animation: rotateIn 0.6s ease-out;
  }
  @keyframes rotateIn {
    from {
      transform-origin: center;
      transform: rotate3d(0, 0, 1, -200deg);
      opacity: 0;
    }
    to {
      transform-origin: center;
      transform: rotate3d(0, 0, 1, 0deg);
      opacity: 1;
    }
  }
  .animate-bounce-in-down {
    animation: bounceInDown 0.6s ease-out;
  }
  @keyframes bounceInDown {
    0% {
      opacity: 0;
      transform: translate3d(0, -3000px, 0);
    }
    60% {
      opacity: 1;
      transform: translate3d(0, 25px, 0);
    }
    75% {
      transform: translate3d(0, -10px, 0);
    }
    90% {
      transform: translate3d(0, 5px, 0);
    }
    100% {
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-bounce-in-up {
    animation: bounceInUp 0.6s ease-out;
  }
  @keyframes bounceInUp {
    0% {
      opacity: 0;
      transform: translate3d(0, 3000px, 0);
    }
    60% {
      opacity: 1;
      transform: translate3d(0, -20px, 0);
    }
    75% {
      transform: translate3d(0, 10px, 0);
    }
    90% {
      transform: translate3d(0, -5px, 0);
    }
    100% {
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-bounce-in-left {
    animation: bounceInLeft 0.6s ease-out;
  }
  @keyframes bounceInLeft {
    0% {
      opacity: 0;
      transform: translate3d(-3000px, 0, 0);
    }
    60% {
      opacity: 1;
      transform: translate3d(25px, 0, 0);
    }
    75% {
      transform: translate3d(-10px, 0, 0);
    }
    90% {
      transform: translate3d(5px, 0, 0);
    }
    100% {
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-bounce-in-right {
    animation: bounceInRight 0.6s ease-out;
  }
  @keyframes bounceInRight {
    0% {
      opacity: 0;
      transform: translate3d(3000px, 0, 0);
    }
    60% {
      opacity: 1;
      transform: translate3d(-25px, 0, 0);
    }
    75% {
      transform: translate3d(10px, 0, 0);
    }
    90% {
      transform: translate3d(-5px, 0, 0);
    }
    100% {
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-flip-in-x {
    animation: flipInX 0.6s ease-out;
  }
  @keyframes flipInX {
    from {
      transform: perspective(400px) rotateX(90deg);
      opacity: 0;
    }
    40% {
      transform: perspective(400px) rotateX(-20deg);
    }
    60% {
      transform: perspective(400px) rotateX(10deg);
      opacity: 1;
    }
    80% {
      transform: perspective(400px) rotateX(-5deg);
    }
    to {
      transform: perspective(400px) rotateX(0deg);
      opacity: 1;
    }
  }
  .animate-flip-in-y {
    animation: flipInY 0.6s ease-out;
  }
  @keyframes flipInY {
    from {
      transform: perspective(400px) rotateY(90deg);
      opacity: 0;
    }
    40% {
      transform: perspective(400px) rotateY(-20deg);
    }
    60% {
      transform: perspective(400px) rotateY(10deg);
      opacity: 1;
    }
    80% {
      transform: perspective(400px) rotateY(-5deg);
    }
    to {
      transform: perspective(400px) rotateY(0deg);
      opacity: 1;
    }
  }
  .animate-light-speed-in {
    animation: lightSpeedIn 0.6s ease-out;
  }
  @keyframes lightSpeedIn {
    from {
      transform: translate3d(100%, 0, 0) skewX(-30deg);
      opacity: 0;
    }
    60% {
      transform: skewX(20deg);
      opacity: 1;
    }
    80% {
      transform: skewX(-5deg);
      opacity: 1;
    }
    to {
      transform: translate3d(0, 0, 0) skewX(0deg);
      opacity: 1;
    }
  }
  .animate-hinge {
    animation: hinge 2s ease-in-out;
  }
  @keyframes hinge {
    0% {
      transform-origin: top left;
      animation-timing-function: ease-in-out;
    }
    20%, 60% {
      transform: rotate3d(0, 0, 1, 80deg);
      transform-origin: top left;
      animation-timing-function: ease-in-out;
    }
    40%, 80% {
      transform: rotate3d(0, 0, 1, 60deg);
      transform-origin: top left;
      animation-timing-function: ease-in-out;
      opacity: 1;
    }
    to {
      transform: translate3d(0, 700px, 0);
      opacity: 0;
    }
  }
  .animate-roll-in {
    animation: rollIn 0.6s ease-out;
  }
  @keyframes rollIn {
    from {
      opacity: 0;
      transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    }
    to {
      opacity: 1;
      transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0deg);
    }
  }
  .animate-roll-out {
    animation: rollOut 0.6s ease-out;
  }
  @keyframes rollOut {
    from {
      opacity: 1;
      transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0deg);
    }
    to {
      opacity: 0;
      transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    }
  }
  .animate-zoom-in-down {
    animation: zoomInDown 0.6s ease-out;
  }
  @keyframes zoomInDown {
    from {
      opacity: 0;
      transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
      animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    60% {
      opacity: 1;
      transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
    to {
      opacity: 1;
      transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
  }
  .animate-zoom-in-left {
    animation: zoomInLeft 0.6s ease-out;
  }
  @keyframes zoomInLeft {
    from {
      opacity: 0;
      transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
      animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    60% {
      opacity: 1;
      transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
    to {
      opacity: 1;
      transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
  }
  .animate-zoom-in-right {
    animation: zoomInRight 0.6s ease-out;
  }
  @keyframes zoomInRight {
    from {
      opacity: 0;
      transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
      animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    60% {
      opacity: 1;
      transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
    to {
      opacity: 1;
      transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
  }
  .animate-zoom-in-up {
    animation: zoomInUp 0.6s ease-out;
  }
  @keyframes zoomInUp {
    from {
      opacity: 0;
      transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
      animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    60% {
      opacity: 1;
      transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
    to {
      opacity: 1;
      transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
  }
  .animate-zoom-out-down {
    animation: zoomOutDown 0.6s ease-out;
  }
  @keyframes zoomOutDown {
    40% {
      opacity: 1;
      transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
      animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    to {
      opacity: 0;
      transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
      transform-origin: center bottom;
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
  }
  .animate-zoom-out-left {
    animation: zoomOutLeft 0.6s ease-out;
  }
  @keyframes zoomOutLeft {
    40% {
      opacity: 1;
      transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    }
    to {
      opacity: 0;
      transform: scale(0.1) translate3d(-2000px, 0, 0);
      transform-origin: left center;
    }
  }
  .animate-zoom-out-right {
    animation: zoomOutRight 0.6s ease-out;
  }
  @keyframes zoomOutRight {
    40% {
      opacity: 1;
      transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    }
    to {
      opacity: 0;
      transform: scale(0.1) translate3d(2000px, 0, 0);
      transform-origin: right center;
    }
  }
  .animate-zoom-out-up {
    animation: zoomOutUp 0.6s ease-out;
  }
  @keyframes zoomOutUp {
    40% {
      opacity: 1;
      transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    }
    to {
      opacity: 0;
      transform: scale(0.1) translate3d(0, -2000px, 0);
      transform-origin: center bottom;
    }
  }
  .animate-slide-in-down {
    animation: slideInDown 0.6s ease-out;
  }
  @keyframes slideInDown {
    from {
      transform: translate3d(0, -100%, 0);
      visibility: visible;
    }
    to {
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-slide-in-left {
    animation: slideInLeft 0.6s ease-out;
  }
  @keyframes slideInLeft {
    from {
      transform: translate3d(-100%, 0, 0);
      visibility: visible;
    }
    to {
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-slide-in-right {
    animation: slideInRight 0.6s ease-out;
  }
  @keyframes slideInRight {
    from {
      transform: translate3d(100%, 0, 0);
      visibility: visible;
    }
    to {
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-slide-in-up {
    animation: slideInUp 0.6s ease-out;
  }
  @keyframes slideInUp {
    from {
      transform: translate3d(0, 100%, 0);
      visibility: visible;
    }
    to {
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-slide-out-down {
    animation: slideOutDown 0.6s ease-out;
  }
  @keyframes slideOutDown {
    from {
      transform: translate3d(0, 0, 0);
    }
    to {
      visibility: hidden;
      transform: translate3d(0, 100%, 0);
    }
  }
  .animate-slide-out-left {
    animation: slideOutLeft 0.6s ease-out;
  }
  @keyframes slideOutLeft {
    from {
      transform: translate3d(0, 0, 0);
    }
    to {
      visibility: hidden;
      transform: translate3d(-100%, 0, 0);
    }
  }
  .animate-slide-out-right {
    animation: slideOutRight 0.6s ease-out;
  }
  @keyframes slideOutRight {
    from {
      transform: translate3d(0, 0, 0);
    }
    to {
      visibility: hidden;
      transform: translate3d(100%, 0, 0);
    }
  }
  .animate-slide-out-up {
    animation: slideOutUp 0.6s ease-out;
  }
  @keyframes slideOutUp {
    from {
      transform: translate3d(0, 0, 0);
    }
    to {
      visibility: hidden;
      transform: translate3d(0, -100%, 0);
    }
  }
  .animate-bounce-out {
    animation: bounceOut 0.6s ease-in-out;
  }
  @keyframes bounceOut {
    20% {
      transform: scale3d(0.9, 0.9, 0.9);
    }
    50%, 55% {
      opacity: 1;
      transform: scale3d(1.1, 1.1, 1.1);
    }
    to {
      opacity: 0;
      transform: scale3d(0.3, 0.3, 0.3);
    }
  }
  .animate-bounce-out-down {
    animation: bounceOutDown 0.6s ease-in-out;
  }
  @keyframes bounceOutDown {
    20% {
      transform: translate3d(0, 10px, 0);
    }
    40%, 45% {
      opacity: 1;
      transform: translate3d(0, -20px, 0);
    }
    to {
      opacity: 0;
      transform: translate3d(0, 2000px, 0);
    }
  }
  .animate-bounce-out-left {
    animation: bounceOutLeft 0.6s ease-in-out;
  }
  @keyframes bounceOutLeft {
    20% {
      opacity: 1;
      transform: translate3d(20px, 0, 0);
    }
    to {
      opacity: 0;
      transform: translate3d(-2000px, 0, 0);
    }
  }
  .animate-bounce-out-right {
    animation: bounceOutRight 0.6s ease-in-out;
  }
  @keyframes bounceOutRight {
    20% {
      opacity: 1;
      transform: translate3d(-20px, 0, 0);
    }
    to {
      opacity: 0;
      transform: translate3d(2000px, 0, 0);
    }
  }
  .animate-bounce-out-up {
    animation: bounceOutUp 0.6s ease-in-out;
  }
  @keyframes bounceOutUp {
    20% {
      transform: translate3d(0, -10px, 0);
    }
    40%, 45% {
      opacity: 1;
      transform: translate3d(0, 20px, 0);
    }
    to {
      opacity: 0;
      transform: translate3d(0, -2000px, 0);
    }
  }
  .animate-fade-out {
    animation: fadeOut 0.6s ease-out;
  }
  @keyframes fadeOut {
    from {
      opacity: 1;
    }
    to {
      opacity: 0;
    }
  }
  .animate-fade-out-down {
    animation: fadeOutDown 0.6s ease-out;
  }
  @keyframes fadeOutDown {
    from {
      opacity: 1;
    }
    to {
      opacity: 0;
      transform: translate3d(0, 100%, 0);
    }
  }
  .animate-fade-out-left {
    animation: fadeOutLeft 0.6s ease-out;
  }
  @keyframes fadeOutLeft {
    from {
      opacity: 1;
    }
    to {
      opacity: 0;
      transform: translate3d(-100%, 0, 0);
    }
  }
  .animate-fade-out-right {
    animation: fadeOutRight 0.6s ease-out;
  }
  @keyframes fadeOutRight {
    from {
      opacity: 1;
    }
    to {
      opacity: 0;
      transform: translate3d(100%, 0, 0);
    }
  }
  .animate-fade-out-up {
    animation: fadeOutUp 0.6s ease-out;
  }
  @keyframes fadeOutUp {
    from {
      opacity: 1;
    }
    to {
      opacity: 0;
      transform: translate3d(0, -100%, 0);
    }
  }
  .animate-flip-out-x {
    animation: flipOutX 0.6s ease-in-out;
  }
  @keyframes flipOutX {
    from {
      transform: perspective(400px);
    }
    30% {
      transform: perspective(400px) rotateX(-20deg);
      opacity: 1;
    }
    to {
      transform: perspective(400px) rotateX(90deg);
      opacity: 0;
    }
  }
  .animate-flip-out-y {
    animation: flipOutY 0.6s ease-in-out;
  }
  @keyframes flipOutY {
    from {
      transform: perspective(400px);
    }
    30% {
      transform: perspective(400px) rotateY(-15deg);
      opacity: 1;
    }
    to {
      transform: perspective(400px) rotateY(90deg);
      opacity: 0;
    }
  }
  .animate-light-speed-out {
    animation: lightSpeedOut 0.6s ease-in-out;
  }
  @keyframes lightSpeedOut {
    from {
      opacity: 1;
    }
    to {
      transform: translate3d(100%, 0, 0) skewX(30deg);
      opacity: 0;
    }
  }
  .animate-rotate-out {
    animation: rotateOut 0.6s ease-in-out;
  }
  @keyframes rotateOut {
    from {
      transform-origin: center;
      opacity: 1;
    }
    to {
      transform-origin: center;
      transform: rotate3d(0, 0, 1, 200deg);
      opacity: 0;
    }
  }
  .animate-rotate-out-down-left {
    animation: rotateOutDownLeft 0.6s ease-in-out;
  }
  @keyframes rotateOutDownLeft {
    from {
      transform-origin: left bottom;
      opacity: 1;
    }
    to {
      transform-origin: left bottom;
      transform: rotate3d(0, 0, 1, 45deg);
      opacity: 0;
    }
  }
  .animate-rotate-out-down-right {
    animation: rotateOutDownRight 0.6s ease-in-out;
  }
  @keyframes rotateOutDownRight {
    from {
      transform-origin: right bottom;
      opacity: 1;
    }
    to {
      transform-origin: right bottom;
      transform: rotate3d(0, 0, 1, -45deg);
      opacity: 0;
    }
  }
  .animate-rotate-out-up-left {
    animation: rotateOutUpLeft 0.6s ease-in-out;
  }
  @keyframes rotateOutUpLeft {
    from {
      transform-origin: left top;
      opacity: 1;
    }
    to {
      transform-origin: left top;
      transform: rotate3d(0, 0, 1, -45deg);
      opacity: 0;
    }
  }
  .animate-rotate-out-up-right {
    animation: rotateOutUpRight 0.6s ease-in-out;
  }
  @keyframes rotateOutUpRight {
    from {
      transform-origin: right top;
      opacity: 1;
    }
    to {
      transform-origin: right top;
      transform: rotate3d(0, 0, 1, 45deg);
      opacity: 0;
    }
  }
  .animate-hinge-out {
    animation: hingeOut 2s ease-in-out;
  }
  @keyframes hingeOut {
    0% {
      transform-origin: top left;
      animation-timing-function: ease-in-out;
    }
    20%, 60% {
      transform: rotate3d(0, 0, 1, -80deg);
      transform-origin: top left;
      animation-timing-function: ease-in-out;
    }
    40%, 80% {
      transform: rotate3d(0, 0, 1, -60deg);
      transform-origin: top left;
      animation-timing-function: ease-in-out;
      opacity: 1;
    }
    to {
      transform: translate3d(0, -700px, 0);
      opacity: 0;
    }
  }
  .animate-zoom-out-bounce {
    animation: zoomOutBounce 0.6s ease-in-out;
  }
  @keyframes zoomOutBounce {
    40% {
      opacity: 1;
      transform: scale3d(0.475, 0.475, 0.475);
    }
    to {
      opacity: 0;
      transform: scale3d(0.1, 0.1, 0.1);
    }
  }
  .animate-pulse-slow {
    animation: pulseSlow 3s cubic-bezier(0.4, 0, 0.6, 1) infinite;
  }
  @keyframes pulseSlow {
    0%, 100% {
      opacity: 1;
    }
    50% {
      opacity: 0.3;
    }
  }
  .animate-bounce-slow {
    animation: bounceSlow 2s infinite;
  }
  @keyframes bounceSlow {
    0%, 100% {
      transform: translateY(-25%);
      animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
    }
    50% {
      transform: translateY(0);
      animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
    }
  }
  .animate-spin-reverse {
    animation: spinReverse 1s linear infinite;
  }
  @keyframes spinReverse {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(-360deg);
    }
  }
  .animate-spin-reverse-slow {
    animation: spinReverseSlow 3s linear infinite;
  }
  @keyframes spinReverseSlow {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(-360deg);
    }
  }
  .animate-float-slow {
    animation: floatSlow 4s ease-in-out infinite;
  }
  @keyframes floatSlow {
    0% {
      transform: translateY(0px);
    }
    50% {
      transform: translateY(-15px);
    }
    100% {
      transform: translateY(0px);
    }
  }
  .animate-glow-slow {
    animation: glowSlow 3s ease-in-out infinite alternate;
  }
  @keyframes glowSlow {
    from {
      box-shadow: 0 0 5px rgba(59, 130, 246, 0.4);
    }
    to {
      box-shadow: 0 0 25px rgba(59, 130, 246, 0.8);
    }
  }
  .animate-shake-slow {
    animation: shakeSlow 0.8s cubic-bezier(.36,.07,.19,.97) both;
  }
  @keyframes shakeSlow {
    10%, 90% {
      transform: translate3d(-1px, 0, 0);
    }
    20%, 80% {
      transform: translate3d(2px, 0, 0);
    }
    30%, 50%, 70% {
      transform: translate3d(-4px, 0, 0);
    }
    40%, 60% {
      transform: translate3d(4px, 0, 0);
    }
  }
  .animate-flip-slow {
    animation: flipSlow 0.8s ease-in-out;
  }
  @keyframes flipSlow {
    0% {
      transform: perspective(400px) rotateY(0);
    }
    40% {
      transform: perspective(400px) translateZ(150px) rotateY(-190deg);
    }
    50% {
      transform: perspective(400px) translateZ(150px) rotateY(-190deg);
    }
    80% {
      transform: perspective(400px) rotateY(0);
    }
    100% {
      transform: perspective(400px) rotateY(0);
    }
  }
  .animate-fade-in-slow {
    animation: fadeInSlow 0.8s ease-in-out;
  }
  @keyframes fadeInSlow {
    from {
      opacity: 0;
      transform: translateY(20px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  .animate-slide-in-slow {
    animation: slideInSlow 0.8s ease-in-out;
  }
  @keyframes slideInSlow {
    from {
      opacity: 0;
      transform: translateX(-20px);
    }
    to {
      opacity: 1;
      transform: translateX(0);
    }
  }
  .animate-bounce-in-slow {
    animation: bounceInSlow 0.8s ease-out;
  }
  @keyframes bounceInSlow {
    0% {
      opacity: 0;
      transform: scale(0.3);
    }
    50% {
      opacity: 1;
      transform: scale(1.05);
    }
    70% {
      transform: scale(0.9);
    }
    100% {
      opacity: 1;
      transform: scale(1);
    }
  }
  .animate-zoom-in-slow {
    animation: zoomInSlow 0.8s ease-out;
  }
  @keyframes zoomInSlow {
    from {
      opacity: 0;
      transform: scale3d(0.3, 0.3, 0.3);
    }
    50% {
      opacity: 1;
    }
    to {
      opacity: 1;
      transform: scale3d(1, 1, 1);
    }
  }
  .animate-rotate-in-slow {
    animation: rotateInSlow 0.8s ease-out;
  }
  @keyframes rotateInSlow {
    from {
      transform-origin: center;
      transform: rotate3d(0, 0, 1, -200deg);
      opacity: 0;
    }
    to {
      transform-origin: center;
      transform: rotate3d(0, 0, 1, 0deg);
      opacity: 1;
    }
  }
  .animate-fade-in-up-slow {
    animation: fadeInUpSlow 0.8s ease-out;
  }
  @keyframes fadeInUpSlow {
    from {
      opacity: 0;
      transform: translate3d(0, 40px, 0);
    }
    to {
      opacity: 1;
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-fade-in-down-slow {
    animation: fadeInDownSlow 0.8s ease-out;
  }
  @keyframes fadeInDownSlow {
    from {
      opacity: 0;
      transform: translate3d(0, -40px, 0);
    }
    to {
      opacity: 1;
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-fade-in-left-slow {
    animation: fadeInLeftSlow 0.8s ease-out;
  }
  @keyframes fadeInLeftSlow {
    from {
      opacity: 0;
      transform: translate3d(-40px, 0, 0);
    }
    to {
      opacity: 1;
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-fade-in-right-slow {
    animation: fadeInRightSlow 0.8s ease-out;
  }
  @keyframes fadeInRightSlow {
    from {
      opacity: 0;
      transform: translate3d(40px, 0, 0);
    }
    to {
      opacity: 1;
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-bounce-in-down-slow {
    animation: bounceInDownSlow 0.8s ease-out;
  }
  @keyframes bounceInDownSlow {
    0% {
      opacity: 0;
      transform: translate3d(0, -3000px, 0);
    }
    60% {
      opacity: 1;
      transform: translate3d(0, 25px, 0);
    }
    75% {
      transform: translate3d(0, -10px, 0);
    }
    90% {
      transform: translate3d(0, 5px, 0);
    }
    100% {
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-bounce-in-up-slow {
    animation: bounceInUpSlow 0.8s ease-out;
  }
  @keyframes bounceInUpSlow {
    0% {
      opacity: 0;
      transform: translate3d(0, 3000px, 0);
    }
    60% {
      opacity: 1;
      transform: translate3d(0, -20px, 0);
    }
    75% {
      transform: translate3d(0, 10px, 0);
    }
    90% {
      transform: translate3d(0, -5px, 0);
    }
    100% {
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-bounce-in-left-slow {
    animation: bounceInLeftSlow 0.8s ease-out;
  }
  @keyframes bounceInLeftSlow {
    0% {
      opacity: 0;
      transform: translate3d(-3000px, 0, 0);
    }
    60% {
      opacity: 1;
      transform: translate3d(25px, 0, 0);
    }
    75% {
      transform: translate3d(-10px, 0, 0);
    }
    90% {
      transform: translate3d(5px, 0, 0);
    }
    100% {
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-bounce-in-right-slow {
    animation: bounceInRightSlow 0.8s ease-out;
  }
  @keyframes bounceInRightSlow {
    0% {
      opacity: 0;
      transform: translate3d(3000px, 0, 0);
    }
    60% {
      opacity: 1;
      transform: translate3d(-25px, 0, 0);
    }
    75% {
      transform: translate3d(10px, 0, 0);
    }
    90% {
      transform: translate3d(-5px, 0, 0);
    }
    100% {
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-flip-in-x-slow {
    animation: flipInXSlow 0.8s ease-out;
  }
  @keyframes flipInXSlow {
    from {
      transform: perspective(400px) rotateX(90deg);
      opacity: 0;
    }
    40% {
      transform: perspective(400px) rotateX(-20deg);
    }
    60% {
      transform: perspective(400px) rotateX(10deg);
      opacity: 1;
    }
    80% {
      transform: perspective(400px) rotateX(-5deg);
    }
    to {
      transform: perspective(400px) rotateX(0deg);
      opacity: 1;
    }
  }
  .animate-flip-in-y-slow {
    animation: flipInYSlow 0.8s ease-out;
  }
  @keyframes flipInYSlow {
    from {
      transform: perspective(400px) rotateY(90deg);
      opacity: 0;
    }
    40% {
      transform: perspective(400px) rotateY(-20deg);
    }
    60% {
      transform: perspective(400px) rotateY(10deg);
      opacity: 1;
    }
    80% {
      transform: perspective(400px) rotateY(-5deg);
    }
    to {
      transform: perspective(400px) rotateY(0deg);
      opacity: 1;
    }
  }
  .animate-light-speed-in-slow {
    animation: lightSpeedInSlow 0.8s ease-out;
  }
  @keyframes lightSpeedInSlow {
    from {
      transform: translate3d(100%, 0, 0) skewX(-30deg);
      opacity: 0;
    }
    60% {
      transform: skewX(20deg);
      opacity: 1;
    }
    80% {
      transform: skewX(-5deg);
      opacity: 1;
    }
    to {
      transform: translate3d(0, 0, 0) skewX(0deg);
      opacity: 1;
    }
  }
  .animate-hinge-slow {
    animation: hingeSlow 2.5s ease-in-out;
  }
  @keyframes hingeSlow {
    0% {
      transform-origin: top left;
      animation-timing-function: ease-in-out;
    }
    20%, 60% {
      transform: rotate3d(0, 0, 1, 80deg);
      transform-origin: top left;
      animation-timing-function: ease-in-out;
    }
    40%, 80% {
      transform: rotate3d(0, 0, 1, 60deg);
      transform-origin: top left;
      animation-timing-function: ease-in-out;
      opacity: 1;
    }
    to {
      transform: translate3d(0, 700px, 0);
      opacity: 0;
    }
  }
  .animate-roll-in-slow {
    animation: rollInSlow 0.8s ease-out;
  }
  @keyframes rollInSlow {
    from {
      opacity: 0;
      transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    }
    to {
      opacity: 1;
      transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0deg);
    }
  }
  .animate-roll-out-slow {
    animation: rollOutSlow 0.8s ease-out;
  }
  @keyframes rollOutSlow {
    from {
      opacity: 1;
      transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0deg);
    }
    to {
      opacity: 0;
      transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    }
  }
  .animate-zoom-in-down-slow {
    animation: zoomInDownSlow 0.8s ease-out;
  }
  @keyframes zoomInDownSlow {
    from {
      opacity: 0;
      transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
      animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    60% {
      opacity: 1;
      transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
    to {
      opacity: 1;
      transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
  }
  .animate-zoom-in-left-slow {
    animation: zoomInLeftSlow 0.8s ease-out;
  }
  @keyframes zoomInLeftSlow {
    from {
      opacity: 0;
      transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
      animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    60% {
      opacity: 1;
      transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
    to {
      opacity: 1;
      transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
  }
  .animate-zoom-in-right-slow {
    animation: zoomInRightSlow 0.8s ease-out;
  }
  @keyframes zoomInRightSlow {
    from {
      opacity: 0;
      transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
      animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    60% {
      opacity: 1;
      transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
    to {
      opacity: 1;
      transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
  }
  .animate-zoom-in-up-slow {
    animation: zoomInUpSlow 0.8s ease-out;
  }
  @keyframes zoomInUpSlow {
    from {
      opacity: 0;
      transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
      animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    60% {
      opacity: 1;
      transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
    to {
      opacity: 1;
      transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
  }
  .animate-slide-in-down-slow {
    animation: slideInDownSlow 0.8s ease-out;
  }
  @keyframes slideInDownSlow {
    from {
      transform: translate3d(0, -100%, 0);
      visibility: visible;
    }
    to {
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-slide-in-left-slow {
    animation: slideInLeftSlow 0.8s ease-out;
  }
  @keyframes slideInLeftSlow {
    from {
      transform: translate3d(-100%, 0, 0);
      visibility: visible;
    }
    to {
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-slide-in-right-slow {
    animation: slideInRightSlow 0.8s ease-out;
  }
  @keyframes slideInRightSlow {
    from {
      transform: translate3d(100%, 0, 0);
      visibility: visible;
    }
    to {
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-slide-in-up-slow {
    animation: slideInUpSlow 0.8s ease-out;
  }
  @keyframes slideInUpSlow {
    from {
      transform: translate3d(0, 100%, 0);
      visibility: visible;
    }
    to {
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-fade-out-slow {
    animation: fadeOutSlow 0.8s ease-out;
  }
  @keyframes fadeOutSlow {
    from {
      opacity: 1;
    }
    to {
      opacity: 0;
    }
  }
  .animate-fade-out-down-slow {
    animation: fadeOutDownSlow 0.8s ease-out;
  }
  @keyframes fadeOutDownSlow {
    from {
      opacity: 1;
    }
    to {
      opacity: 0;
      transform: translate3d(0, 100%, 0);
    }
  }
  .animate-fade-out-left-slow {
    animation: fadeOutLeftSlow 0.8s ease-out;
  }
  @keyframes fadeOutLeftSlow {
    from {
      opacity: 1;
    }
    to {
      opacity: 0;
      transform: translate3d(-100%, 0, 0);
    }
  }
  .animate-fade-out-right-slow {
    animation: fadeOutRightSlow 0.8s ease-out;
  }
  @keyframes fadeOutRightSlow {
    from {
      opacity: 1;
    }
    to {
      opacity: 0;
      transform: translate3d(100%, 0, 0);
    }
  }
  .animate-fade-out-up-slow {
    animation: fadeOutUpSlow 0.8s ease-out;
  }
  @keyframes fadeOutUpSlow {
    from {
      opacity: 1;
    }
    to {
      opacity: 0;
      transform: translate3d(0, -100%, 0);
    }
  }
  .animate-slide-out-down-slow {
    animation: slideOutDownSlow 0.8s ease-out;
  }
  @keyframes slideOutDownSlow {
    from {
      transform: translate3d(0, 0, 0);
    }
    to {
      visibility: hidden;
      transform: translate3d(0, 100%, 0);
    }
  }
  .animate-slide-out-left-slow {
    animation: slideOutLeftSlow 0.8s ease-out;
  }
  @keyframes slideOutLeftSlow {
    from {
      transform: translate3d(0, 0, 0);
    }
    to {
      visibility: hidden;
      transform: translate3d(-100%, 0, 0);
    }
  }
  .animate-slide-out-right-slow {
    animation: slideOutRightSlow 0.8s ease-out;
  }
  @keyframes slideOutRightSlow {
    from {
      transform: translate3d(0, 0, 0);
    }
    to {
      visibility: hidden;
      transform: translate3d(100%, 0, 0);
    }
  }
  .animate-slide-out-up-slow {
    animation: slideOutUpSlow 0.8s ease-out;
  }
  @keyframes slideOutUpSlow {
    from {
      transform: translate3d(0, 0, 0);
    }
    to {
      visibility: hidden;
      transform: translate3d(0, -100%, 0);
    }
  }
  .animate-bounce-out-slow {
    animation: bounceOutSlow 0.8s ease-in-out;
  }
  @keyframes bounceOutSlow {
    20% {
      transform: scale3d(0.9, 0.9, 0.9);
    }
    50%, 55% {
      opacity: 1;
      transform: scale3d(1.1, 1.1, 1.1);
    }
    to {
      opacity: 0;
      transform: scale3d(0.3, 0.3, 0.3);
    }
  }
  .animate-bounce-out-down-slow {
    animation: bounceOutDownSlow 0.8s ease-in-out;
  }
  @keyframes bounceOutDownSlow {
    20% {
      transform: translate3d(0, 10px, 0);
    }
    40%, 45% {
      opacity: 1;
      transform: translate3d(0, -20px, 0);
    }
    to {
      opacity: 0;
      transform: translate3d(0, 2000px, 0);
    }
  }
  .animate-bounce-out-left-slow {
    animation: bounceOutLeftSlow 0.8s ease-in-out;
  }
  @keyframes bounceOutLeftSlow {
    20% {
      opacity: 1;
      transform: translate3d(20px, 0, 0);
    }
    to {
      opacity: 0;
      transform: translate3d(-2000px, 0, 0);
    }
  }
  .animate-bounce-out-right-slow {
    animation: bounceOutRightSlow 0.8s ease-in-out;
  }
  @keyframes bounceOutRightSlow {
    20% {
      opacity: 1;
      transform: translate3d(-20px, 0, 0);
    }
    to {
      opacity: 0;
      transform: translate3d(2000px, 0, 0);
    }
  }
  .animate-bounce-out-up-slow {
    animation: bounceOutUpSlow 0.8s ease-in-out;
  }
  @keyframes bounceOutUpSlow {
    20% {
      transform: translate3d(0, -10px, 0);
    }
    40%, 45% {
      opacity: 1;
      transform: translate3d(0, 20px, 0);
    }
    to {
      opacity: 0;
      transform: translate3d(0, -2000px, 0);
    }
  }
  .animate-flip-out-x-slow {
    animation: flipOutXSlow 0.8s ease-in-out;
  }
  @keyframes flipOutXSlow {
    from {
      transform: perspective(400px);
    }
    30% {
      transform: perspective(400px) rotateX(-20deg);
      opacity: 1;
    }
    to {
      transform: perspective(400px) rotateX(90deg);
      opacity: 0;
    }
  }
  .animate-flip-out-y-slow {
    animation: flipOutYSlow 0.8s ease-in-out;
  }
  @keyframes flipOutYSlow {
    from {
      transform: perspective(400px);
    }
    30% {
      transform: perspective(400px) rotateY(-15deg);
      opacity: 1;
    }
    to {
      transform: perspective(400px) rotateY(90deg);
      opacity: 0;
    }
  }
  .animate-light-speed-out-slow {
    animation: lightSpeedOutSlow 0.8s ease-in-out;
  }
  @keyframes lightSpeedOutSlow {
    from {
      opacity: 1;
    }
    to {
      transform: translate3d(100%, 0, 0) skewX(30deg);
      opacity: 0;
    }
  }
  .animate-rotate-out-slow {
    animation: rotateOutSlow 0.8s ease-in-out;
  }
  @keyframes rotateOutSlow {
    from {
      transform-origin: center;
      opacity: 1;
    }
    to {
      transform-origin: center;
      transform: rotate3d(0, 0, 1, 200deg);
      opacity: 0;
    }
  }
  .animate-rotate-out-down-left-slow {
    animation: rotateOutDownLeftSlow 0.8s ease-in-out;
  }
  @keyframes rotateOutDownLeftSlow {
    from {
      transform-origin: left bottom;
      opacity: 1;
    }
    to {
      transform-origin: left bottom;
      transform: rotate3d(0, 0, 1, 45deg);
      opacity: 0;
    }
  }
  .animate-rotate-out-down-right-slow {
    animation: rotateOutDownRightSlow 0.8s ease-in-out;
  }
  @keyframes rotateOutDownRightSlow {
    from {
      transform-origin: right bottom;
      opacity: 1;
    }
    to {
      transform-origin: right bottom;
      transform: rotate3d(0, 0, 1, -45deg);
      opacity: 0;
    }
  }
  .animate-rotate-out-up-left-slow {
    animation: rotateOutUpLeftSlow 0.8s ease-in-out;
  }
  @keyframes rotateOutUpLeftSlow {
    from {
      transform-origin: left top;
      opacity: 1;
    }
    to {
      transform-origin: left top;
      transform: rotate3d(0, 0, 1, -45deg);
      opacity: 0;
    }
  }
  .animate-rotate-out-up-right-slow {
    animation: rotateOutUpRightSlow 0.8s ease-in-out;
  }
  @keyframes rotateOutUpRightSlow {
    from {
      transform-origin: right top;
      opacity: 1;
    }
    to {
      transform-origin: right top;
      transform: rotate3d(0, 0, 1, 45deg);
      opacity: 0;
    }
  }
  .animate-hinge-out-slow {
    animation: hingeOutSlow 2.5s ease-in-out;
  }
  @keyframes hingeOutSlow {
    0% {
      transform-origin: top left;
      animation-timing-function: ease-in-out;
    }
    20%, 60% {
      transform: rotate3d(0, 0, 1, -80deg);
      transform-origin: top left;
      animation-timing-function: ease-in-out;
    }
    40%, 80% {
      transform: rotate3d(0, 0, 1, -60deg);
      transform-origin: top left;
      animation-timing-function: ease-in-out;
      opacity: 1;
    }
    to {
      transform: translate3d(0, -700px, 0);
      opacity: 0;
    }
  }
  .animate-zoom-out-bounce-slow {
    animation: zoomOutBounceSlow 0.8s ease-in-out;
  }
  @keyframes zoomOutBounceSlow {
    40% {
      opacity: 1;
      transform: scale3d(0.475, 0.475, 0.475);
    }
    to {
      opacity: 0;
      transform: scale3d(0.1, 0.1, 0.1);
    }
  }
  .animate-pulse-fast {
    animation: pulseFast 1s cubic-bezier(0.4, 0, 0.6, 1) infinite;
  }
  @keyframes pulseFast {
    0%, 100% {
      opacity: 1;
    }
    50% {
      opacity: 0.5;
    }
  }
  .animate-bounce-fast {
    animation: bounceFast 0.5s infinite;
  }
  @keyframes bounceFast {
    0%, 100% {
      transform: translateY(-25%);
      animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
    }
    50% {
      transform: translateY(0);
      animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
    }
  }
  .animate-spin-fast {
    animation: spinFast 0.5s linear infinite;
  }
  @keyframes spinFast {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(360deg);
    }
  }
  .animate-spin-reverse-fast {
    animation: spinReverseFast 0.5s linear infinite;
  }
  @keyframes spinReverseFast {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(-360deg);
    }
  }
  .animate-float-fast {
    animation: floatFast 1.5s ease-in-out infinite;
  }
  @keyframes floatFast {
    0% {
      transform: translateY(0px);
    }
    50% {
      transform: translateY(-10px);
    }
    100% {
      transform: translateY(0px);
    }
  }
  .animate-glow-fast {
    animation: glowFast 1s ease-in-out infinite alternate;
  }
  @keyframes glowFast {
    from {
      box-shadow: 0 0 5px rgba(59, 130, 246, 0.4);
    }
    to {
      box-shadow: 0 0 20px rgba(59, 130, 246, 0.8);
    }
  }
  .animate-shake-fast {
    animation: shakeFast 0.3s cubic-bezier(.36,.07,.19,.97) both;
  }
  @keyframes shakeFast {
    10%, 90% {
      transform: translate3d(-1px, 0, 0);
    }
    20%, 80% {
      transform: translate3d(2px, 0, 0);
    }
    30%, 50%, 70% {
      transform: translate3d(-4px, 0, 0);
    }
    40%, 60% {
      transform: translate3d(4px, 0, 0);
    }
  }
  .animate-flip-fast {
    animation: flipFast 0.4s ease-in-out;
  }
  @keyframes flipFast {
    0% {
      transform: perspective(400px) rotateY(0);
    }
    40% {
      transform: perspective(400px) translateZ(150px) rotateY(-190deg);
    }
    50% {
      transform: perspective(400px) translateZ(150px) rotateY(-190deg);
    }
    80% {
      transform: perspective(400px) rotateY(0);
    }
    100% {
      transform: perspective(400px) rotateY(0);
    }
  }
  .animate-fade-in-fast {
    animation: fadeInFast 0.3s ease-in-out;
  }
  @keyframes fadeInFast {
    from {
      opacity: 0;
      transform: translateY(20px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  .animate-slide-in-fast {
    animation: slideInFast 0.3s ease-in-out;
  }
  @keyframes slideInFast {
    from {
      opacity: 0;
      transform: translateX(-20px);
    }
    to {
      opacity: 1;
      transform: translateX(0);
    }
  }
  .animate-bounce-in-fast {
    animation: bounceInFast 0.4s ease-out;
  }
  @keyframes bounceInFast {
    0% {
      opacity: 0;
      transform: scale(0.3);
    }
    50% {
      opacity: 1;
      transform: scale(1.05);
    }
    70% {
      transform: scale(0.9);
    }
    100% {
      opacity: 1;
      transform: scale(1);
    }
  }
  .animate-zoom-in-fast {
    animation: zoomInFast 0.3s ease-out;
  }
  @keyframes zoomInFast {
    from {
      opacity: 0;
      transform: scale3d(0.3, 0.3, 0.3);
    }
    50% {
      opacity: 1;
    }
    to {
      opacity: 1;
      transform: scale3d(1, 1, 1);
    }
  }
  .animate-rotate-in-fast {
    animation: rotateInFast 0.4s ease-out;
  }
  @keyframes rotateInFast {
    from {
      transform-origin: center;
      transform: rotate3d(0, 0, 1, -200deg);
      opacity: 0;
    }
    to {
      transform-origin: center;
      transform: rotate3d(0, 0, 1, 0deg);
      opacity: 1;
    }
  }
  .animate-fade-in-up-fast {
    animation: fadeInUpFast 0.3s ease-out;
  }
  @keyframes fadeInUpFast {
    from {
      opacity: 0;
      transform: translate3d(0, 40px, 0);
    }
    to {
      opacity: 1;
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-fade-in-down-fast {
    animation: fadeInDownFast 0.3s ease-out;
  }
  @keyframes fadeInDownFast {
    from {
      opacity: 0;
      transform: translate3d(0, -40px, 0);
    }
    to {
      opacity: 1;
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-fade-in-left-fast {
    animation: fadeInLeftFast 0.3s ease-out;
  }
  @keyframes fadeInLeftFast {
    from {
      opacity: 0;
      transform: translate3d(-40px, 0, 0);
    }
    to {
      opacity: 1;
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-fade-in-right-fast {
    animation: fadeInRightFast 0.3s ease-out;
  }
  @keyframes fadeInRightFast {
    from {
      opacity: 0;
      transform: translate3d(40px, 0, 0);
    }
    to {
      opacity: 1;
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-bounce-in-down-fast {
    animation: bounceInDownFast 0.4s ease-out;
  }
  @keyframes bounceInDownFast {
    0% {
      opacity: 0;
      transform: translate3d(0, -3000px, 0);
    }
    60% {
      opacity: 1;
      transform: translate3d(0, 25px, 0);
    }
    75% {
      transform: translate3d(0, -10px, 0);
    }
    90% {
      transform: translate3d(0, 5px, 0);
    }
    100% {
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-bounce-in-up-fast {
    animation: bounceInUpFast 0.4s ease-out;
  }
  @keyframes bounceInUpFast {
    0% {
      opacity: 0;
      transform: translate3d(0, 3000px, 0);
    }
    60% {
      opacity: 1;
      transform: translate3d(0, -20px, 0);
    }
    75% {
      transform: translate3d(0, 10px, 0);
    }
    90% {
      transform: translate3d(0, -5px, 0);
    }
    100% {
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-bounce-in-left-fast {
    animation: bounceInLeftFast 0.4s ease-out;
  }
  @keyframes bounceInLeftFast {
    0% {
      opacity: 0;
      transform: translate3d(-3000px, 0, 0);
    }
    60% {
      opacity: 1;
      transform: translate3d(25px, 0, 0);
    }
    75% {
      transform: translate3d(-10px, 0, 0);
    }
    90% {
      transform: translate3d(5px, 0, 0);
    }
    100% {
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-bounce-in-right-fast {
    animation: bounceInRightFast 0.4s ease-out;
  }
  @keyframes bounceInRightFast {
    0% {
      opacity: 0;
      transform: translate3d(3000px, 0, 0);
    }
    60% {
      opacity: 1;
      transform: translate3d(-25px, 0, 0);
    }
    75% {
      transform: translate3d(10px, 0, 0);
    }
    90% {
      transform: translate3d(-5px, 0, 0);
    }
    100% {
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-flip-in-x-fast {
    animation: flipInXFast 0.4s ease-out;
  }
  @keyframes flipInXFast {
    from {
      transform: perspective(400px) rotateX(90deg);
      opacity: 0;
    }
    40% {
      transform: perspective(400px) rotateX(-20deg);
    }
    60% {
      transform: perspective(400px) rotateX(10deg);
      opacity: 1;
    }
    80% {
      transform: perspective(400px) rotateX(-5deg);
    }
    to {
      transform: perspective(400px) rotateX(0deg);
      opacity: 1;
    }
  }
  .animate-flip-in-y-fast {
    animation: flipInYFast 0.4s ease-out;
  }
  @keyframes flipInYFast {
    from {
      transform: perspective(400px) rotateY(90deg);
      opacity: 0;
    }
    40% {
      transform: perspective(400px) rotateY(-20deg);
    }
    60% {
      transform: perspective(400px) rotateY(10deg);
      opacity: 1;
    }
    80% {
      transform: perspective(400px) rotateY(-5deg);
    }
    to {
      transform: perspective(400px) rotateY(0deg);
      opacity: 1;
    }
  }
  .animate-light-speed-in-fast {
    animation: lightSpeedInFast 0.4s ease-out;
  }
  @keyframes lightSpeedInFast {
    from {
      transform: translate3d(100%, 0, 0) skewX(-30deg);
      opacity: 0;
    }
    60% {
      transform: skewX(20deg);
      opacity: 1;
    }
    80% {
      transform: skewX(-5deg);
      opacity: 1;
    }
    to {
      transform: translate3d(0, 0, 0) skewX(0deg);
      opacity: 1;
    }
  }
  .animate-hinge-fast {
    animation: hingeFast 1.5s ease-in-out;
  }
  @keyframes hingeFast {
    0% {
      transform-origin: top left;
      animation-timing-function: ease-in-out;
    }
    20%, 60% {
      transform: rotate3d(0, 0, 1, 80deg);
      transform-origin: top left;
      animation-timing-function: ease-in-out;
    }
    40%, 80% {
      transform: rotate3d(0, 0, 1, 60deg);
      transform-origin: top left;
      animation-timing-function: ease-in-out;
      opacity: 1;
    }
    to {
      transform: translate3d(0, 700px, 0);
      opacity: 0;
    }
  }
  .animate-roll-in-fast {
    animation: rollInFast 0.4s ease-out;
  }
  @keyframes rollInFast {
    from {
      opacity: 0;
      transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    }
    to {
      opacity: 1;
      transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0deg);
    }
  }
  .animate-roll-out-fast {
    animation: rollOutFast 0.4s ease-out;
  }
  @keyframes rollOutFast {
    from {
      opacity: 1;
      transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0deg);
    }
    to {
      opacity: 0;
      transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    }
  }
  .animate-zoom-in-down-fast {
    animation: zoomInDownFast 0.4s ease-out;
  }
  @keyframes zoomInDownFast {
    from {
      opacity: 0;
      transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
      animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    60% {
      opacity: 1;
      transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
    to {
      opacity: 1;
      transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
  }
  .animate-zoom-in-left-fast {
    animation: zoomInLeftFast 0.4s ease-out;
  }
  @keyframes zoomInLeftFast {
    from {
      opacity: 0;
      transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
      animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    60% {
      opacity: 1;
      transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
    to {
      opacity: 1;
      transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
  }
  .animate-zoom-in-right-fast {
    animation: zoomInRightFast 0.4s ease-out;
  }
  @keyframes zoomInRightFast {
    from {
      opacity: 0;
      transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
      animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    60% {
      opacity: 1;
      transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
    to {
      opacity: 1;
      transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
  }
  .animate-zoom-in-up-fast {
    animation: zoomInUpFast 0.4s ease-out;
  }
  @keyframes zoomInUpFast {
    from {
      opacity: 0;
      transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
      animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    60% {
      opacity: 1;
      transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
    to {
      opacity: 1;
      transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
  }
  .animate-slide-in-down-fast {
    animation: slideInDownFast 0.3s ease-out;
  }
  @keyframes slideInDownFast {
    from {
      transform: translate3d(0, -100%, 0);
      visibility: visible;
    }
    to {
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-slide-in-left-fast {
    animation: slideInLeftFast 0.3s ease-out;
  }
  @keyframes slideInLeftFast {
    from {
      transform: translate3d(-100%, 0, 0);
      visibility: visible;
    }
    to {
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-slide-in-right-fast {
    animation: slideInRightFast 0.3s ease-out;
  }
  @keyframes slideInRightFast {
    from {
      transform: translate3d(100%, 0, 0);
      visibility: visible;
    }
    to {
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-slide-in-up-fast {
    animation: slideInUpFast 0.3s ease-out;
  }
  @keyframes slideInUpFast {
    from {
      transform: translate3d(0, 100%, 0);
      visibility: visible;
    }
    to {
      transform: translate3d(0, 0, 0);
    }
  }
  .animate-fade-out-fast {
    animation: fadeOutFast 0.3s ease-out;
  }
  @keyframes fadeOutFast {
    from {
      opacity: 1;
    }
    to {
      opacity: 0;
    }
  }
  .animate-fade-out-down-fast {
    animation: fadeOutDownFast 0.3s ease-out;
  }
  @keyframes fadeOutDownFast {
    from {
      opacity: 1;
    }
    to {
      opacity: 0;
      transform: translate3d(0, 100%, 0);
    }
  }
  .animate-fade-out-left-fast {
    animation: fadeOutLeftFast 0.3s ease-out;
  }
  @keyframes fadeOutLeftFast {
    from {
      opacity: 1;
    }
    to {
      opacity: 0;
      transform: translate3d(-100%, 0, 0);
    }
  }
  .animate-fade-out-right-fast {
    animation: fadeOutRightFast 0.3s ease-out;
  }
  @keyframes fadeOutRightFast {
    from {
      opacity: 1;
    }
    to {
      opacity: 0;
      transform: translate3d(100%, 0, 0);
    }
  }
  .animate-fade-out-up-fast {
    animation: fadeOutUpFast 0.3s ease-out;
  }
  @keyframes fadeOutUpFast {
