@font-face{font-family:outrun;src:url(/assets/outrunfuturebolditalic-CbVlRSDR.otf) format("truetype")}:root{--color-primary: rgb(181, 122, 170);--color-secondary: #241734;--color-tertiary: rgb(226, 214, 220);--color-quaternary: rgb(108, 55, 88);--color-quinary: rgb(181, 122, 170)}#render-canvas{width:15vw;height:15vw}main{display:flex;flex-direction:column;align-items:center;justify-content:center}header{display:flex;align-items:center;width:100vw}#heading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%}@media screen and (max-width: 600px){#heading-container{width:90%;margin-top:1rem}}header h2{background:#5d88ad;background:linear-gradient(180deg,#5d88ad,#fffefd 47%,#e2d6dc 49%,#6c3758 57%,#b57aaa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-family:outrun;width:90%;padding:0;margin:0;font-size:4rem;filter:drop-shadow(.15rem .15rem #FFF);text-align:center}.subheading{font-family:Fira Code,sans-serif;font-size:1rem}.under-shadow{filter:drop-shadow(0rem .75rem black)}.heading-offset{margin-top:-1rem;margin-left:4rem}.content-split{display:flex;flex-direction:row;width:100vw}.color-tertiary{color:var(--color-tertiary)}.color-primary{color:var(--color-primary)}.color-secondary{color:var(--color-secondary)}.margin-sm{margin:.5rem}.margin-md{margin:1rem}nav{display:flex;background-color:#e2d6dc33;border-radius:.25rem;box-shadow:1rem 1rem 1rem #0003;padding:.5rem;margin:1.5rem;position:fixed;border:solid .1rem var(--color-primary)}.link{color:var(--color-tertiary);padding:.5rem;font-family:Fira Code,sans-serif;font-weight:700}.link:hover{color:#5d88ad}.content{font-family:Fira Code,sans-serif;color:var(--color-tertiary)}.panel{display:flex;flex-direction:column;align-items:center;justify-content:center;width:50%;height:100%;background:linear-gradient(135deg,#080c12f2,#0c1219eb,#080c12f2);border-radius:0;border:3px solid #2a2a2a;margin:1.5rem;padding:0;box-shadow:inset 0 0 0 8px #1a1a1a,inset 0 0 0 12px #333,inset 0 0 0 16px #1a1a1a,inset 0 0 80px #000c,inset 0 0 40px #b57aaa0d,0 10px 30px #00000080;animation-name:terminalGlow;animation-duration:4s;animation-iteration-count:infinite;animation-timing-function:ease-in-out;position:relative;overflow:hidden}.panel:before{content:attr(data-title);position:absolute;top:16px;left:16px;right:16px;height:25px;background:linear-gradient(180deg,#2d2d32e6,#232328e6,#19191ee6);border:1px solid rgba(181,122,170,.3);border-radius:2px 2px 0 0;box-shadow:inset 0 1px #ffffff1a,0 1px 3px #00000080;z-index:10;color:#fff;background:linear-gradient(90deg,#b57aaa,#fff,#b57aaa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-family:Fira Code,monospace;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;line-height:25px;padding:0 8px;display:flex;align-items:center;filter:drop-shadow(0 0 4px rgba(181,122,170,.8)) drop-shadow(0 0 8px rgba(181,122,170,.4))}.panel:after{content:"● ● ●";position:absolute;top:20px;right:24px;color:#b57aaab3;font-size:8px;letter-spacing:3px;z-index:11;font-family:monospace}.panel .panel-content{position:relative;width:calc(100% - 32px);height:calc(100% - 60px);padding:60px 1rem 1rem;margin:16px;background:repeating-linear-gradient(0deg,transparent 0px,transparent 2px,rgba(181,122,170,.02) 2px,rgba(181,122,170,.02) 3px);filter:drop-shadow(0 0 1px rgba(181,122,170,.3));overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:rgba(181,122,170,.5) rgba(0,0,0,.3)}.panel .panel-content::-webkit-scrollbar{width:8px}.panel .panel-content::-webkit-scrollbar-track{background:#0000004d}.panel .panel-content::-webkit-scrollbar-thumb{background:#b57aaa80;border-radius:4px}.panel .panel-content::-webkit-scrollbar-thumb:hover{background:#b57aaab3}.header-fade-slide-left{opacity:0;transform:translate(-50px);animation:fadeSlideLeft 1.2s ease-out forwards}.header-fade-slide-right{opacity:0;transform:translate(50px);animation:fadeSlideRight 1.2s ease-out .3s forwards}.header-fade-only{opacity:0;animation:fadeOnly 1.2s ease-out .6s forwards}.header-slide-complete{opacity:1;transform:translate(0)}.header-fade-complete{opacity:1}@keyframes fadeSlideLeft{to{opacity:1;transform:translate(0)}}@keyframes fadeSlideRight{to{opacity:1;transform:translate(0)}}@keyframes fadeOnly{to{opacity:1}}.vhs-flicker-active{animation:vhsGlitchShort .4s ease-in-out}.scanlines-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;z-index:9999;background:repeating-linear-gradient(0deg,transparent 0px,transparent 3px,rgba(0,0,0,.5) 3px,rgba(0,0,0,.5) 4px);opacity:1}.scanlines-overlay.subtle{background:repeating-linear-gradient(0deg,transparent 0px,transparent 3px,rgba(0,0,0,.15) 3px,rgba(0,0,0,.15) 4px);opacity:.8}@keyframes vhsGlitchShort{0%{transform:translate(0);opacity:1;filter:drop-shadow(.15rem .15rem #FFF)}20%{transform:translate(-2px) skew(1deg);opacity:.8;filter:drop-shadow(.15rem .15rem #FFF) drop-shadow(2px 0 #ff00ff) drop-shadow(-2px 0 #00ffff)}40%{transform:translate(2px) skew(-.5deg);opacity:.9;filter:drop-shadow(.15rem .15rem #FFF) drop-shadow(-1px 0 #ff00ff) drop-shadow(1px 0 #00ffff)}60%{transform:translate(-1px);opacity:.7;filter:drop-shadow(.15rem .15rem #FFF) drop-shadow(3px 0 #ff00ff) drop-shadow(-3px 0 #00ffff)}80%{transform:translate(1px) skew(.5deg);opacity:1;filter:drop-shadow(.15rem .15rem #FFF)}to{transform:translate(0);opacity:1;filter:drop-shadow(.15rem .15rem #FFF)}}@media screen and (max-width: 600px){.panel{width:90%}}.copyright-head{color:var(--color-tertiary);font-family:Fira Code,sans-serif;position:absolute;top:0;right:0;margin-right:1rem;font-size:.75rem}.text-lg{font-size:1.5rem}.text-md{font-size:1.2rem}.text-sm{font-size:.75rem}html{background:#241734}.achievements-list li{margin:.25rem}.achievements-list li:before{list-style-type:none;content:">";margin:0 .5rem}.project-container{display:flex;width:100%;flex-direction:column;align-items:start}.project-link{display:flex;flex-direction:column;align-items:center;width:fit-content;margin:.5rem}.grid{margin:0 auto;position:fixed;bottom:0;left:-50%;background-color:linear-gradient(180deg,rgba(36,23,52,1) 0%,rgba(46,33,87,1) 100%);background-image:linear-gradient(90deg,transparent 0%,transparent 85%,#FD3777 90%,transparent 95%),linear-gradient(0deg,transparent 0%,transparent 85%,#FD3777 90%,transparent 95%);background-size:12px 12px;width:200vw;height:60vh;transform:translateZ(0) perspective(100px) rotateX(45deg);perspective-origin:top;animation-name:movement;animation-duration:48s;animation-iteration-count:infinite;animation-timing-function:linear;z-index:-1}.grid:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(to top,transparent,#241734)}@keyframes movement{0%{background-position:0% 0%}to{background-position:0% 100%}}@keyframes terminalGlow{0%{border-color:#2a2a2a;box-shadow:inset 0 0 0 8px #1a1a1a,inset 0 0 0 12px #333,inset 0 0 0 16px #1a1a1a,inset 0 0 80px #000c,inset 0 0 40px #b57aaa0d,0 10px 30px #00000080,0 0 8px #b57aaa33}50%{border-color:#b57aaa4d;box-shadow:inset 0 0 0 8px #1a1a1a,inset 0 0 0 12px #b57aaa1a,inset 0 0 0 16px #1a1a1a,inset 0 0 80px #000c,inset 0 0 40px #b57aaa1a,0 10px 30px #00000080,0 0 15px #b57aaa66,0 0 25px #b57aaa33}to{border-color:#2a2a2a;box-shadow:inset 0 0 0 8px #1a1a1a,inset 0 0 0 12px #333,inset 0 0 0 16px #1a1a1a,inset 0 0 80px #000c,inset 0 0 40px #b57aaa0d,0 10px 30px #00000080,0 0 8px #b57aaa33}}html{scroll-behavior:smooth}.sticky-nav{position:fixed;top:20px;left:20px;z-index:100;padding:15px;background:linear-gradient(145deg,#2d2d32f2,#232328e6,#19191ef2);border-radius:8px;box-shadow:0 6px 12px #0006,inset 0 1px #ffffff1a;border:2px solid rgba(181,122,170,.3);font-family:Fira Code,monospace}.sticky-nav ul{list-style-type:none;padding:0;margin:0;display:flex;gap:8px}.sticky-nav li{margin-bottom:0}.sticky-nav a{text-decoration:none;color:var(--color-tertiary);font-weight:600;font-size:.8rem;text-transform:uppercase;letter-spacing:.5px;transition:all .15s ease;padding:8px 14px;background:linear-gradient(145deg,#3c3c41,#2d2d32 30%,#232328 70%,#19191e);border:2px solid rgba(181,122,170,.3);border-radius:4px;position:relative;box-shadow:0 2px 4px #0000004d,inset 0 1px #ffffff1a,inset 0 -1px #0000004d}.sticky-nav a:after{display:none}.sticky-nav a:hover{color:var(--color-primary);border-color:var(--color-primary);background:linear-gradient(145deg,#46464b,#37373c 30%,#2d2d32 70%,#232328);box-shadow:0 3px 6px #0006,inset 0 1px #b57aaa26,inset 0 -2px #0006,0 0 8px #b57aaa33;transform:translateY(.5px)}.sticky-nav a:active{transform:translateY(1px);box-shadow:0 1px 2px #00000080,inset 0 2px 3px #0006}@media (max-width: 768px){.sticky-nav{display:none}}.tech-icon-container{display:flex;flex-direction:column;align-items:center;margin:.25rem}.tech-icon{width:100px;height:auto;max-width:100%;transition:transform .2s ease}.tech-icon:hover{transform:scale(1.1)}.tech-icon-label{font-size:.8rem;text-align:center;margin-top:.25rem}.tech-stack-container{display:flex;flex-direction:column;width:100%;justify-content:center;align-items:center}.tech-stack-grid{display:flex;flex-direction:row;width:100%;justify-content:space-evenly;flex-wrap:wrap;gap:.5rem}@media screen and (max-width: 600px){.tech-icon{width:40px!important;min-width:40px}.tech-icon-label{font-size:.6rem;margin:.1rem}.tech-stack-grid{gap:.25rem}.tech-icon-container{margin:.1rem}}@media screen and (max-width: 768px) and (min-width: 601px){.tech-icon{width:60px!important;min-width:60px}.tech-icon-label{font-size:.7rem}}hr{border:none;height:1px;background:linear-gradient(to right,transparent,var(--color-primary),var(--color-tertiary),var(--color-primary),transparent);margin:2rem auto;opacity:.7;width:80%;max-width:800px;animation:breathe 6s ease-in-out infinite}@keyframes breathe{0%{width:95%}50%{width:80%}to{width:95%}}.project-container a{word-break:normal;overflow-wrap:break-word;word-break:break-all;-webkit-hyphens:auto;hyphens:auto;max-width:100%}.project-link a{text-decoration:none}.project-link a div{text-decoration:none;color:var(--color-tertiary);font-weight:500;animation:pulse 2s infinite;transition:all .3s ease;padding:6px 12px;border:1px solid transparent;border-radius:4px;position:relative}.project-link a div:after{content:"";position:absolute;bottom:0;left:0;width:0;height:2px;background-color:var(--color-tertiary);transition:width .3s ease}.project-link a div:hover{animation:none;color:color-mix(in srgb,var(--color-tertiary) 70%,black);opacity:1;border-color:var(--color-tertiary);background-color:#ffffff0d}.project-link a:hover:after{width:100%}