:root{--color-background: #ffffff;--color-text: #121212;--color-heading: #000000;--color-text-muted: hsl(0, 0%, 35%);--color-divider: hsl(0, 0%, 85%);--color-border: hsl(0, 0%, 80%);--color-shadow: hsl(0, 0%, 80%);--color-primary: #ff40a0;--color-secondary: #ffbf40;--color-link: #0b63d6;--color-link-visited: #7a3be6;--color-stat-cpu: #0064e6;--color-stat-ram: #e6a900;--color-stat-uptime: #e60026;--color-brand-youtube: #ff0033;--color-brand-discord: #5662f6;--animation-duration: .5s;--color-drop-shadow: rgba(0, 0, 0, .1)}@media(prefers-color-scheme:dark){:root{--color-background: #000000;--color-text: #e5e7eb;--color-heading: #ffffff;--color-text-muted: hsl(0, 0%, 65%);--color-divider: hsl(0, 0%, 20%);--color-border: #ffffff;--color-shadow: #ffffff;--color-link: #73a0f4;--color-link-visited: #c58af9;--color-stat-cpu: #599eff;--color-stat-ram: #ffbf00;--color-stat-uptime: #ff002b}}@media(prefers-reduced-motion:reduce){:root{--animation-duration: 0ms}}body{font-family:Rubik,Segoe UI,Verdana,Geneva,sans-serif;background-color:var(--color-background);color:var(--color-text);text-align:center;overflow-x:hidden;animation:hideScrollbar var(--animation-duration) step-end forwards,preventFlash var(--animation-duration);transition:background-color var(--animation-duration) cubic-bezier(.16,1,.3,1),color var(--animation-duration) cubic-bezier(.16,1,.3,1)}.app{max-width:1200px;margin:0 auto;padding:0 20px}hr{height:2px;border:none;background-color:var(--color-divider);border-radius:100px;corner-shape:squircle;transition:background-color var(--animation-duration) cubic-bezier(.16,1,.3,1)}a{text-decoration:none;font-weight:500;color:var(--color-link)}a:visited{color:var(--color-link-visited)}a:hover{text-decoration:underline}a,.cards>div>h2,.cards>div>p,.stats>.cpu,.stats>.ram,.stats>.uptime,footer>.youtube,footer>.discord,footer>h2{transition:color var(--animation-duration) cubic-bezier(.16,1,.3,1)}header>h1{display:inline-block;background:linear-gradient(to right,var(--color-primary),var(--color-secondary));background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-weight:700;font-size:80px;margin:0}header>p{font-size:24px;margin-top:-5px;margin-bottom:15px}.cards{display:flex;justify-content:center;flex-wrap:wrap;align-items:stretch}.cards>div{position:relative;border:1px solid var(--color-border);border-radius:50px;corner-shape:squircle;box-shadow:0 0 5px var(--color-shadow);padding:20px;margin:10px;width:250px;backface-visibility:hidden;transform:translateZ(0);transition:box-shadow var(--animation-duration) cubic-bezier(.16,1,.3,1),border-color var(--animation-duration) cubic-bezier(.16,1,.3,1)}.cards>div>img{height:85px;border-radius:50%;corner-shape:squircle;filter:drop-shadow(0 0 5px var(--color-drop-shadow))}.cards>div>h2{margin-top:10px;color:var(--color-heading)}.cards>div>p{margin-top:-15px;margin-bottom:0;color:var(--color-text-muted);font-size:20px}.images{display:flex;justify-content:center;flex-wrap:wrap;align-items:stretch}.images>div{position:relative;margin:20px;padding:20px;border:1px solid var(--color-border);border-radius:50px;corner-shape:squircle;box-shadow:0 0 5px var(--color-shadow);width:300px;backface-visibility:hidden;transform:translateZ(0);transition:box-shadow var(--animation-duration) cubic-bezier(.16,1,.3,1),border-color var(--animation-duration) cubic-bezier(.16,1,.3,1)}.images>div>a{font-size:28px}.images>div>img{margin-top:20px;height:300px;width:300px;object-fit:contain;filter:drop-shadow(0 0 5px var(--color-drop-shadow))}.cards>div:hover,.images>div:hover{box-shadow:0 0 5px transparent;border-color:transparent}.cards>div:before,.images>div:before,.cards>div:after,.images>div:after{content:"";position:absolute;border-radius:70px;corner-shape:inherit;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;opacity:0;transition:opacity var(--animation-duration) cubic-bezier(.16,1,.3,1)}.cards>div:before,.images>div:before{inset:-20px;padding:20px;background:linear-gradient(to right,var(--color-primary),var(--color-secondary)) content-box;filter:blur(5px)}.cards>div:after,.images>div:after{inset:-1px;border-radius:inherit;padding:1px;background:linear-gradient(to right,var(--color-primary),var(--color-secondary))}.cards>div:hover:before,.images>div:hover:before,.cards>div:hover:after,.images>div:hover:after{opacity:1}.stats,span:not([class]){margin-top:40px;font-weight:700}span:not([class]){display:block}.stats>.cpu{color:var(--color-stat-cpu)}.stats>.ram{color:var(--color-stat-ram)}.stats>.uptime{color:var(--color-stat-uptime)}@media(max-width:679px){.stats,span:not([class]){margin-top:0}}@media(min-width:820px){.stats{display:flex;justify-content:center;flex-wrap:wrap;gap:40px}.stats br{display:none}}@media(min-width:1202px){.stats{gap:0}.stats span{width:342px;margin:0 20px}}footer{font-size:24px}footer>h2{margin-top:0;margin-bottom:5px;color:var(--color-heading);font-size:40px}footer>.youtube{color:var(--color-brand-youtube)}footer>.discord{color:var(--color-brand-discord)}@keyframes hideScrollbar{0%{overflow:hidden}to{overflow-y:auto;overflow-x:hidden}}@keyframes preventFlash{0%,to{background-color:var(--color-background);color:var(--color-text)}}@keyframes preventFlashHr{0%,to{background-color:var(--color-divider)}}@keyframes slideFromTop{0%{transform:translateY(-100vh)}}@keyframes slideFromTopShort{0%{transform:translateY(-100px);opacity:0}}@keyframes slideFromBottom{0%{transform:translateY(100vh)}}@keyframes slideFromBottomShort{0%{transform:translateY(100px);opacity:0}}header>h1,.cards>div{animation:slideFromTop var(--animation-duration) cubic-bezier(.16,1,.3,1) backwards}hr{animation:slideFromTop var(--animation-duration) cubic-bezier(.16,1,.3,1) backwards,preventFlashHr var(--animation-duration)}header>p{animation:slideFromTopShort var(--animation-duration) cubic-bezier(.16,1,.3,1) backwards}.images>div,footer{animation:slideFromBottom var(--animation-duration) cubic-bezier(.16,1,.3,1) backwards}footer hr,.stats~hr,.images>div~hr{animation:slideFromBottom var(--animation-duration) cubic-bezier(.16,1,.3,1) backwards,preventFlashHr var(--animation-duration)}.stats,span:not([class]){animation:slideFromBottomShort var(--animation-duration) cubic-bezier(.16,1,.3,1) backwards}
