@import "https://fonts.googleapis.com/css2?family=Pixelify+Sans:wght@400..700&display=swap";@import "https://fonts.googleapis.com/css2?family=DynaPuff:wght@400..700&display=swap";@import "https://fonts.googleapis.com/css2?family=Geist+Pixel&display=swap";@font-face{font-family:bubble;src:url(./bubble-D-Ewfgae.ttf)format("truetype");font-weight:400;font-style:normal}:root{--orbit-x:80%;--orbit-y:80%;--color-metal-reflect:#efffd0;--color-metal-light:#d7ffd0;--color-metal-mid:#57636d;--color-metal-dark:#2e3d49;--color-metal-shadow:#10161a;--color-green-reflect:#d2ff06;--color-green-light:#15aa5c;--color-green-dark:#258073;--color-green-shadow:#042a05;--color-space-dark:#080616;--color-space-blue:#021e32;--color-space-purple-dark:#2d1142;--color-space-blue-dark:#06062c;--color-text-default:#fff;--color-text-header:#d2ff06;--color-text-subtitle:#00bfff;--color-text-link:#14aa5c;--bubble-border:20px;--bubble-blur:10px;--bubble-grid-size:6px;--bubble-opacity:.5;--bubble-padding:10px;--bubble-grid-color:#d2ff0180;--bubble-font-color:#c8c8c8;--bubble-font-border-color:#000;--bubble-font-top-light:#fffc;--bubble-font-bottom-shadow:#000;--bubble-top-light:#ffffff26;--bubble-bottom-light:#ffffff80;--bubble-bottom-shadow:#000c;--rl-header-height:100px;--rl-footer-height:55px;--rl-max-width:1500px;--modal-background:#07351ded;--modal-grid-color:#011908ed;--modal-grid-size:6px}*{box-sizing:border-box;margin:0;padding:0}html,body,#app{width:100%;min-height:100vh}#app{-webkit-backdrop-filter:blur(50px);backdrop-filter:blur(50px);position:relative;overflow:hidden}#app:before{content:"";z-index:-1;position:absolute;inset:-50%}body:after{content:"";opacity:.9;mix-blend-mode:overlay;pointer-events:none;z-index:9999;background:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='200'%20height='200'%3e%3cfilter%20id='noise'%3e%3cfeTurbulence%20type='fractalNoise'%20baseFrequency='0.8'%20numOctaves='3'%20stitchTiles='stitch'%3e%3c/feTurbulence%3e%3c/filter%3e%3crect%20width='100%25'%20height='100%25'%20filter='url(%23noise)'%3e%3c/rect%3e%3c/svg%3e");width:100%;height:100%;position:fixed;inset:0}.main-page{justify-content:center;align-items:center;min-height:100vh;display:flex}.main-page .text-area{padding:5px;font-size:4vmin}.main-page header{z-index:650;text-align:start;width:30vw;position:fixed;top:1%;left:5%}.main-page footer{z-index:650;text-align:end;width:30vw;position:fixed;bottom:1%;right:5%}#circular-menu{z-index:600;aspect-ratio:1;justify-content:center;align-items:center;width:80vmin;display:flex;position:relative}#circular-menu:before{z-index:0;aspect-ratio:1;content:"";border-radius:50%;width:80%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#circular-menu:after{z-index:2;aspect-ratio:1;content:"";border-radius:50%;width:70%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.circular-path{width:var(--orbit-x);height:var(--orbit-y);position:absolute}.circular-option{z-index:999;cursor:pointer;offset-rotate:0deg;offset-path:ellipse(calc(var(--orbit-x)/2) calc(var(--orbit-y)/2) at 50% 50%);align-items:center;gap:5%;width:35vmin;height:9vmin;display:flex;position:absolute}@keyframes orbit{to{offset-distance:100%}}.circular-option .link{display:inherit;display:inherit;align-items:inherit;position:inherit;gap:inherit;width:inherit;height:inherit;border-radius:10px 100px 30px 10px}.circular-option .option-icon{z-index:0;border-radius:50%;flex-shrink:0;width:25%;height:150%;margin-right:5%;position:relative;transform:rotate(315deg)}.circular-option .decoration{z-index:0;background:var(--color-metal-shadow);width:20%;height:20%;box-shadow:0 0 10px var(--color-metal-shadow), 0 1px 2px var(--color-metal-reflect), 0 -1px 2px var(--color-metal-shadow);border-radius:60%;position:fixed;top:5%;left:5%;transform:rotate(135deg)}.circular-option .decoration:first-of-type{top:80%;left:5%}.circular-option .option-icon:after{z-index:2;width:70%;height:70%;box-shadow:0 0 5px var(--color-metal-shadow), 0 4px 2px var(--color-metal-reflect), 0 -4px 2px var(--color-metal-shadow);content:"";background:radial-gradient(var(--color-green-reflect) 20%, var(--color-green-light), var(--color-green-dark));border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.circular-option .option-text{box-shadow:0 0 5px var(--color-metal-shadow), 0 4px 2px var(--color-metal-reflect), 0 -4px 2px var(--color-metal-shadow);background-image:linear-gradient(to right, var(--color-green-light), var(--color-green-dark));height:70%;color:var(--color-green-reflect);text-shadow:0 0 10px var(--bubble-grid-color);white-space:nowrap;border-radius:5px 80px 10px 5px;flex:1;justify-content:flex-start;align-items:center;margin-right:20px;padding-left:5px;font-family:Pixelify Sans,sans-serif;display:flex;position:relative;overflow:hidden}.circular-option:hover .option-text{text-shadow:0 0 20px var(--color-green-reflect);filter:drop-shadow(0 0 1px var(--color-green-reflect));font-weight:700}.circular-option:hover .option-icon:after{background:radial-gradient(var(--color-green-reflect) 30%, var(--color-green-light), var(--color-green-dark));filter:drop-shadow(0 0 5px var(--color-green-reflect))}#aboutme-circular-option{offset-distance:75%}#aboutme-circular-option .option-text{font-size:3.9vmin}#projects-circular-option{offset-distance:0%}#projects-circular-option .option-text{font-size:3.7vmin}#experience-circular-option{offset-distance:25%}#experience-circular-option .option-text{font-size:3vmin}#gallery-circular-option{offset-distance:50%}#gallery-circular-option .option-text{font-size:4vmin}#digital-face{z-index:800;aspect-ratio:1;width:50%;position:relative}#digital-face:before{z-index:0;background:radial-gradient(circle, var(--color-metal-dark) 0%, var(--color-metal-shadow) 70%);filter:blur(1px);box-shadow:0 0 5px var(--color-metal-shadow), 0 4px 2px #ffffff80, 0 -4px 2px var(--color-metal-shadow);content:"";border-radius:50%;width:100%;height:100%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#digital-face img{z-index:2;filter:grayscale()contrast(250%);opacity:.2;content:"";width:70%;height:70%;display:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#digital-face:after{z-index:2;content:"";background:repeating-linear-gradient(#0000 0 2px,#00000040 3px 4px);border-radius:50%;width:100%;height:100%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}@media (width<=1200px){#circular-menu{--orbit-x:70%;--orbit-y:70%}#digital-face{width:40%}.main-page .text-area{font-size:3vmin}.main-page footer,.main-page header{width:80vw}}.bubble{padding:var(--bubble-padding);border-radius:var(--bubble-border);-webkit-backdrop-filter:blur(var(--bubble-blur));backdrop-filter:blur(var(--bubble-blur));background:radial-gradient(circle at top, var(--bubble-top-light), #ffffff05 40%);box-shadow:inset 0 2px 8px var(--bubble-top-light),  inset 0 -4px 10px var(--bubble-bottom-light),  2px 2px 5px var(--bubble-bottom-shadow);z-index:1;position:relative;overflow:hidden}.bubble:after{content:"";pointer-events:none;z-index:2;border-radius:inherit;background-image:linear-gradient(var(--bubble-grid-color) 1px, transparent 1px);background-size:var(--bubble-grid-size) var(--bubble-grid-size);opacity:var(--bubble-opacity);position:absolute;inset:0}.text-area{text-transform:uppercase;color:var(--bubble-font-color);-webkit-text-stroke:1px var(--bubble-font-border-color);text-shadow:3px 3px 0px var(--bubble-font-bottom-shadow), 0 0 2px var(--bubble-font-top-light);font-family:bubble,sans-serif}.bubble .text-area{border-radius:var(--bubble-border);box-shadow:0px 0px var(--bubble-padding) var(--bubble-bottom-shadow);z-index:0;position:relative;left:50%;transform:translate(-50%)}.logo:before,#circular-menu:after,#circular-menu:before,.metalic{background-image:linear-gradient(var(--color-metal-light), var(--color-metal-mid), var(--color-metal-dark));box-shadow:0 0 5px var(--color-metal-shadow),  inset 0 4px 2px var(--color-metal-reflect),  inset 0 -4px 2px var(--color-metal-shadow)}.non-router{color:inherit;text-decoration:none}@keyframes marquee{0%{transform:translate(100%)}to{transform:translate(-100%)}}.regular-layout{width:100%;height:100vh;min-height:0;max-width:var(--rl-max-width);flex-direction:column;justify-content:center;align-items:center;margin:0 auto;display:flex}.regular-layout .regular-section{scrollbar-width:none;width:95%;padding-top:60px;padding-bottom:var(--rl-footer-height);flex-grow:1;margin-top:65px;padding-left:20px;padding-right:20px;overflow-y:scroll}.regular-layout .regular-section::-webkit-scrollbar{display:none}.regular-layout header{height:var(--rl-header-height);width:100%;max-width:var(--rl-max-width);z-index:999;flex-shrink:0;margin-top:10px;padding:10px;font-size:3vmin;display:flex;position:absolute;top:0}@media (width<=1200px){.regular-layout header{font-size:2vmin}}.regular-layout .navbar-wrapper{border-radius:50%;flex:1;justify-content:center;align-items:center;gap:15px;padding:10px;display:flex}.navbar-wrapper .logo{z-index:70;aspect-ratio:1;border-radius:50%;justify-content:center;align-items:center;height:95%;display:flex;position:absolute}.navbar-wrapper .logo:before{z-index:0;aspect-ratio:1;content:"";border-radius:50%;height:120%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.navbar-wrapper .logo:after{z-index:2;aspect-ratio:1;height:80%;box-shadow:0 0 5px var(--color-metal-shadow), 0 4px 2px var(--color-metal-reflect), 0 -4px 2px var(--color-metal-shadow);content:"";background:radial-gradient(var(--color-green-reflect) 20%, var(--color-green-light), var(--color-green-dark));border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.navbar-wrapper .logo:hover:after{background:radial-gradient(var(--color-green-reflect) 30%, var(--color-green-light), var(--color-green-dark));filter:drop-shadow(0 0 5px var(--color-green-reflect))}.navbar-wrapper .nav{background-image:linear-gradient(to right, var(--color-green-light), var(--color-green-dark));width:90%;height:80%;color:var(--color-green-reflect);text-shadow:0 0 10px var(--bubble-grid-color);box-shadow:0 0 5px var(--color-metal-shadow), 0 4px 2px var(--color-metal-reflect), 0 -4px 2px var(--color-metal-shadow);border-radius:50%;justify-content:space-around;align-items:center;gap:20px;margin:0 10%;padding:0 5%;display:flex}.navbar-wrapper .nav #logo-placeholder{aspect-ratio:1;background:#000;height:190%}.navbar-wrapper .nav .nav-option{font-family:Pixelify Sans,sans-serif}.navbar-wrapper .nav .nav-option:hover{text-shadow:0 0 20px var(--color-green-reflect);filter:drop-shadow(0 0 1px var(--color-green-reflect))}.regular-layout footer{z-index:999;border-radius:100% 100% 20% 20%;flex-shrink:0;justify-content:center;align-items:center;width:100%;height:100px;display:flex;position:absolute;bottom:-50px}.regular-layout footer .marquee-area{background-image:linear-gradient(to right, var(--color-green-light), var(--color-green-dark));color:var(--color-green-reflect);filter:drop-shadow(0 0 1px var(--color-green-reflect));box-shadow:0 0 5px var(--color-metal-shadow), 0 4px 2px var(--color-metal-reflect), 0 -4px 2px var(--color-metal-shadow);border-radius:50%;justify-content:center;align-items:center;width:75%;margin-bottom:40px;padding:0;font-size:2vmin;display:flex;overflow:hidden}.regular-layout footer .marquee-area .marquee-text{width:100%;text-shadow:0 0 20px var(--color-green-reflect);filter:drop-shadow(0 0 1px var(--color-green-reflect));font-family:Pixelify Sans,sans-serif;font-weight:700;animation:15s linear infinite marquee;display:flex}.panel{border-radius:30px;width:100%;margin-bottom:50px;overflow:hidden}.panel-header{z-index:100;cursor:pointer;border-radius:30px;justify-content:flex-start;align-items:center;gap:20px;height:80px;padding:5px;display:flex;position:relative}.panel-icon{z-index:1;aspect-ratio:1;height:95%;-webkit-backdrop-filter:blur(var(--bubble-blur));backdrop-filter:blur(var(--bubble-blur));background:radial-gradient(circle at 25% 20%, #fff9, #ffffff0d 15%, transparent 70%), radial-gradient(circle at top, var(--bubble-top-light), #ffffff05 40%);box-shadow:inset 0 2px 8px var(--bubble-top-light), inset 0 -4px 10px var(--bubble-bottom-light), 2px 2px 5px var(--bubble-bottom-shadow);border-radius:50%;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.panel-icon .icon{z-index:0;content:"";border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.panel-icon:before{content:"";z-index:1;pointer-events:none;background:radial-gradient(circle at 25% 20%,#fff9,#0000 30%);border-radius:50%;position:absolute;inset:0}.panel-title{flex:1;align-items:center;height:90%;padding-left:10px;font-size:5vmin;display:flex}.panel-title.selected{color:#d2c81480;text-shadow:3px 3px 0px var(--bubble-font-bottom-shadow), 0 0 2px #d2ff1480}.panel-header:hover .panel-icon{transform:scale(1.1)}.panel-header:hover .panel-title{transform:scale(1.01)}.panel-content{padding:var(--bubble-padding);grid-template-columns:repeat(4,1fr);grid-auto-rows:auto;gap:10px;margin:20px 10px 10px;display:grid;overflow:auto}.tiny-div{grid-column:span 1}.small-div{grid-column:span 2}.medium-div{grid-column:span 3}.large-div{grid-column:span 4}.panel-content div{text-align:justify;box-shadow:0px 0px var(--bubble-padding) var(--bubble-bottom-shadow);background:#000;display:flex}.panel-content .centered{text-align:center!important;justify-content:center!important;align-items:center!important;display:flex!important}.panel-content div p{z-index:100;width:fit-content;height:fit-content;padding:var(--bubble-padding);color:var(--color-text-default);text-shadow:0 0 1px #000;font-family:Geist Pixel,sans-serif;font-size:3vmin}.panel-content div h1{color:var(--color-text-header);text-shadow:0px 0px 25px var(--color-text-header), 0px 0px 1px black;font-size:4vmin}.panel-content div h2{opacity:.7;color:var(--color-text-subtitle);text-shadow:0px 0px 25px var(--color-text-subtitle), 0px 0px 1px black;font-size:3.5vmin}.panel-content div a{cursor:pointer;-webkit-text-decoration:solid underline var(--color-text-link) 3px;text-decoration:solid underline var(--color-text-link) 3px;color:var(--color-text-link);text-shadow:0px 0px 25px var(--color-text-link), 0px 0px 1px black}.panel-content div a:hover{text-shadow:0px 0px 10px var(--color-green-light), 0px 0px 1px black}.panel-content div img{padding:var(--bubble-padding);text-align:center;object-fit:contain;width:100%;min-width:100px;height:100%;min-height:100px}.preview-img{flex-direction:column;justify-content:center;align-items:center;display:flex}.preview-img img{cursor:pointer;object-fit:cover;width:100%;height:100%}.preview-img:hover{box-shadow:0px 0px 5px var(--color-green-reflect)}.preview-img .caption{font-size:3vmin}.modal{z-index:99999;background:var(--modal-background);background-image:linear-gradient(var(--modal-grid-color) 1px, transparent 1px);background-size:var(--modal-grid-size) var(--modal-grid-size);width:100%;height:100%;display:flex;position:absolute;top:0;left:0;overflow:hidden}.modal .modal-image{flex-direction:column;flex:1;justify-content:center;align-items:center;max-width:50vw;display:flex;overflow:hidden}.modal .modal-image img{object-fit:contain;width:auto;max-width:45vw;height:auto;max-height:90vh;box-shadow:0px 0px 10px var(--color-green-reflect)}.modal .modal-description{flex-direction:column;flex:1;justify-content:center;align-items:center;max-width:50vw;display:flex;overflow:hidden}.modal .modal-description p{color:var(--color-text-header);flex-direction:column;justify-content:center;align-items:center;margin-right:20%;font-family:Geist Pixel,sans-serif;font-size:2vmax;display:flex;overflow:hidden}.modal .modal-close{color:var(--color-text-subtitle);opacity:.8;pointer-events:none;background:#0000008c;border-radius:8px;padding:10px;font-family:Geist Pixel,sans-serif;font-size:2vmin;position:absolute;top:1%;right:1%}.space{z-index:-1;background:linear-gradient(0deg, var(--color-space-blue) 2%, var(--color-space-blue-dark) 10%, var(--color-space-purple-dark) 40%, var(--color-space-dark) 95%);width:100%;height:100%;position:fixed;inset:0}.space:after{content:"";opacity:.9;mix-blend-mode:overlay;z-index:999;background:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='200'%20height='200'%3e%3cfilter%20id='noise'%3e%3cfeTurbulence%20type='fractalNoise'%20baseFrequency='0.8'%20numOctaves='3'%20stitchTiles='stitch'%3e%3c/feTurbulence%3e%3c/filter%3e%3crect%20width='100%25'%20height='100%25'%20filter='url(%23noise)'%3e%3c/rect%3e%3c/svg%3e");width:100%;height:100%;position:absolute;inset:0}.poly-planet{transform-style:preserve-3d;--size:150px;--bg-image:"textures/default.jpg";width:var(--size);aspect-ratio:1;background-image:var(--bg-image);background-position:50%;background-size:cover;animation:5s linear infinite planetRotation;position:relative}.poly-planet .face{background-image:inherit;width:var(--size);aspect-ratio:1;position:absolute}.poly-planet .-no1{transform:translateZ(calc(var(--size) *.5));background-color:red}.poly-planet .-no2{transform:rotateY(90deg) translateZ(calc(var(--size) *.5));background-color:green}.poly-planet .-no3{transform:rotateY(180deg) translateZ(calc(var(--size) *.5));background-color:#00f}.poly-planet .-no4{transform:rotateY(270deg) translateZ(calc(var(--size) *.5));background-color:#ff0}.poly-planet .-no5{transform:rotateX(90deg) translateZ(calc(var(--size) *.5));background-color:purple}.poly-planet .-no6{transform:rotateX(270deg) translateZ(calc(var(--size) *.5));background-color:orange}#mars{background-image:url(mars_texture.jpg)}@keyframes planetRotation{0%{transform:rotateY(1deg)rotateX(1deg)}to{transform:rotateY(364deg)rotateX(364deg)}}.mars{background-image:url(2k_mars.jpg);background-position:50%;background-size:cover;border-radius:50%;width:300px;height:300px;animation:30s linear infinite rotateMars;position:absolute;top:50%;left:10%;box-shadow:inset -40px -40px 60px #0009,inset 20px 20px 40px #ffffff26,0 0 30px #ff783233}