@charset "UTF-8";@import"https://fonts.googleapis.com/css2?family=Patrick+Hand&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap";*{box-sizing:border-box;margin:0;padding:0}:root{--color-black: #000;--color-white: #fff;--color-shark-50: #f3f6f8;--color-shark-100: #e2eaeb;--color-shark-200: #c7d6da;--color-shark-300: #a1b9bf;--color-shark-400: #72939e;--color-shark-500: #577783;--color-shark-600: #4b646f;--color-shark-700: #41545d;--color-shark-800: #3b484f;--color-shark-900: #343e45;--color-shark-950: #191f23;--color-blue-50: #eff6ff;--color-blue-100: #dbeafe;--color-blue-200: #c0dafd;--color-blue-300: #a1cbfc;--color-blue-400: #62a3f8;--color-blue-500: #3d81f4;--color-blue-600: #2862e8;--color-blue-700: #1f4dd6;--color-blue-800: #2040ad;--color-blue-900: #1f3a89;--color-blue-950: #182453;--color-red: #f43d3d;--color-ludum: #f3911e;--background: var(--color-white);--color: var(--color-shark-900);--accent-color: var(--color-red);--border-width: 2rem}html{font-size:20px}html,body{overflow-x:hidden;font-family:Patrick Hand,sans-serif}body{position:relative;--color: black;scroll-snap-points-y:repeat(300px)}body:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:var(--color);z-index:-2;transition:.5s ease}.webgl{position:fixed;top:0;left:0;outline:none;z-index:-1}canvas:not(.webgl){opacity:0;pointer-events:none;display:none}.header{position:fixed}.navigation{position:fixed;top:50%;right:calc(var(--border-width) + 1rem);display:flex;flex-direction:column;gap:.5rem}.navigation li{list-style:none}.navigation li i{display:block;width:1rem;aspect-ratio:1;border-radius:50%;background:transparent;border:2px dashed black}body.active .parent{overflow-y:scroll;overflow-x:hidden}.parent{height:100vh;width:100vw;scroll-snap-type:y mandatory;overflow:hidden;display:flex;flex-direction:column}.container{scroll-snap-align:center;width:100vw;height:100vh;margin:0 auto;position:relative;color:var(--text-color, black);flex:none}.container .content{opacity:0;transform:translateY(2rem);transition:1s ease}.container.active .content{opacity:1;transform:translateY(0)}.container>figure{display:none}.container .card{height:100%;width:100%;display:flex;justify-content:space-between;align-items:flex-end;border:var(--border-width) solid var(--color-white);padding:2rem}.container .card .content{display:flex;flex-direction:column;gap:.5rem}.container .card .content .time{--size: 2px;--text-border-color: var(--color);transition:.5s ease;text-shadow:0 var(--size) var(--text-border-color),var(--size) 0 var(--text-border-color),0 calc(-1 * var(--size)) var(--text-border-color),calc(-1 * var(--size)) 0 var(--text-border-color);margin-bottom:-.5rem}.container .card .content h2{font-size:3rem;line-height:1em;--size: 2px;--text-border-color: var(--color);transition:.5s ease;text-shadow:0 var(--size) var(--text-border-color),var(--size) 0 var(--text-border-color),0 calc(-1 * var(--size)) var(--text-border-color),calc(-1 * var(--size)) 0 var(--text-border-color)}.container .card .content>figure{display:none}.container .card .content .badges{display:flex;flex-wrap:wrap;gap:.4em;font-weight:600}.container .card .content .badges .techs,.container .card .content .badges .languages,.container .card .content .badges .links{display:contents;gap:.5rem;font-size:.8rem}.container .card .content .badges .techs a,.container .card .content .badges .techs span,.container .card .content .badges .languages a,.container .card .content .badges .languages span,.container .card .content .badges .links a,.container .card .content .badges .links span{padding:.2em .4em;border-radius:.4em;transition:.5s ease;color:var(--color-white);position:relative;overflow:hidden;background:#0006;outline:2px solid var(--color)}.container .card .content .badges .techs a:before,.container .card .content .badges .techs span:before,.container .card .content .badges .languages a:before,.container .card .content .badges .languages span:before,.container .card .content .badges .links a:before,.container .card .content .badges .links span:before{content:"";background:var(--color);position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1}.container .card .content .badges .links>a{text-decoration:none}.container .card .content .badges .links>a:after{content:"↗"}.container .card .content .badges .links .itch{background:var(--color-red)}.container .card .content .badges .links .ludum{background:var(--color-ludum)}.container .card .content .badges .languages span{background:#000c}.container .card .content .gallery{display:flex;gap:.5rem}.container .card .content .gallery figure{height:9rem;aspect-ratio:1.6}.container .card .content .gallery figure img{object-fit:cover;height:100%;width:100%;border-radius:.5rem;outline:2px solid var(--color);box-shadow:.4rem .4rem 0 var(--color-black)}.container .card .content .description{--size: 2px;--text-border-color: var(--color);transition:.5s ease;text-shadow:0 var(--size) var(--text-border-color),var(--size) 0 var(--text-border-color),0 calc(-1 * var(--size)) var(--text-border-color),calc(-1 * var(--size)) 0 var(--text-border-color);max-width:600px;text-wrap-style:balance}.container .card .content .description a{color:var(--accent-color)}.container .card .content .trophies{display:flex;flex-direction:column;--size: 2px;--text-border-color: var(--color);transition:.5s ease;text-shadow:0 var(--size) var(--text-border-color),var(--size) 0 var(--text-border-color),0 calc(-1 * var(--size)) var(--text-border-color),calc(-1 * var(--size)) 0 var(--text-border-color)}.container .card .content .trophies>span{display:inline-flex;align-items:center;gap:.2rem}.container .trigger{position:absolute;z-index:-1;top:50%;left:50%;transform:translate(-50%,-50%);height:1px}.next{display:flex;align-items:flex-end;gap:1rem;--size: 2px;--text-border-color: var(--color);transition:.5s ease;text-shadow:0 var(--size) var(--text-border-color),var(--size) 0 var(--text-border-color),0 calc(-1 * var(--size)) var(--text-border-color),calc(-1 * var(--size)) 0 var(--text-border-color);font-weight:600;cursor:pointer}.next span{transition:.2s ease}.next:hover span{transform:scale(1.1)}.next .arrow{--line-width: 3px;--line-color: var(--color-black);display:block;position:relative;height:2rem;width:var(--line-width);background:var(--line-color);margin-top:1rem;animation:float infinite 1s}.next .arrow:before{position:absolute;top:100%;left:0;content:"";width:.5rem;aspect-ratio:1;border-left:var(--line-width) solid var(--line-color);border-bottom:var(--line-width) solid var(--line-color);transform:translate(calc(-50% + var(--line-width) / 2),-100%) rotate(-45deg)}.container.welcome{display:flex;align-items:center;padding:4rem}.container.welcome h1{font-size:3rem;margin-bottom:.6em;z-index:1;display:block;position:relative;--size: 2px;--text-border-color: var(--color);transition:.5s ease;text-shadow:0 var(--size) var(--text-border-color),var(--size) 0 var(--text-border-color),0 calc(-1 * var(--size)) var(--text-border-color),calc(-1 * var(--size)) 0 var(--text-border-color)}.container.welcome h2{--size: 2px;--text-border-color: var(--color);transition:.5s ease;text-shadow:0 var(--size) var(--text-border-color),var(--size) 0 var(--text-border-color),0 calc(-1 * var(--size)) var(--text-border-color),calc(-1 * var(--size)) 0 var(--text-border-color)}.container.welcome h2 strong{position:relative;padding:.1em .2em;color:var(--color-black)}.container.welcome h2 strong:before{content:"";position:absolute;background:var(--color-white);border-radius:.2em;display:inline-block;top:0;right:0;bottom:0;left:0;z-index:-1;transform:translateY(.05em)}.container.welcome h2 strong:after{content:"";height:1em;width:4px;background:var(--color-black);animation:blink infinite 1s linear;display:inline-block;border-radius:1em;transform:translateY(.1em);margin-left:.1em}.container.welcome .next{transform:translate(.4rem)}.container.welcome .next .arrow{height:4rem;--line-color: var(--text-color)}.container.welcome .content{line-height:1.2em}@keyframes float{0%{transform:translateY(-.2rem)}50%{transform:translateY(.2rem)}to{transform:translateY(-.2rem)}}@keyframes blink{0%{opacity:0}50%{opacity:1}0%{opacity:0}}.icon-trophy:before{content:"🏆"}.icon-chart:before{content:"📈"}.icon-wrench:before{content:"🔧"}.icon-trophy-1:before{content:"🥇"}.icon-trophy-2:before{content:"🥈"}.icon-trophy-3:before{content:"🥉"}
