body{scrollbar-width:none;background-color:#0d0d0d;background-image:url(/AboutWallpaper.jpg);background-repeat:repeat;background-size:20vh 20vw;background-attachment:fixed;height:100%;margin:0;padding:0}html::-webkit-scrollbar{display:none}h1,h2,h3{font-family:Pixelscapes,sans-serif}.App{text-align:center;overflow:hidden}.spin-cw{animation:6s linear infinite spinClockwise}.spin-ccw{animation:6s linear infinite spinCounterClockwise}.icon{width:64px;height:64px;image-rendering:pixelated;animation-duration:6s;animation-timing-function:linear;animation-iteration-count:infinite}@keyframes spinClockwise{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes spinCounterClockwise{0%{transform:rotate(0)}to{transform:rotate(-360deg)}}@media (prefers-reduced-motion){.hidden{transition:none}}.nav{color:#f5d9a6;z-index:1000;justify-content:space-between;align-items:stretch;padding:1rem 2rem;font-family:Pixelscapes,serif;font-size:1.2rem;display:flex;top:0}.nav a{color:#f5d9a6;font-weight:500;text-decoration:none;transition:color .3s}.nav a:hover{color:#ffea63}.nav a.active{background-color:rgba(0,0,0,.3);border-radius:10px}.about{font-size:2rem}.about-container{text-align:center;color:#f5d9a6;background:0 0;border:2px solid rgba(245,217,166,.4);border-radius:24px;max-width:75vw;margin:40px auto;padding:20px 30px;font-family:Pixelscapes,serif;transition:all .4s cubic-bezier(.175,.885,.32,2.2);animation:1s ease-out forwards fadeInUp;position:relative;box-shadow:0 0 0 2px rgba(245,217,166,.3),0 8px 32px rgba(0,0,0,.8),inset 0 0 20px rgba(245,217,166,.05)}.about-container:before{content:"";-webkit-mask-composite:xor;pointer-events:none;background:linear-gradient(135deg,rgba(245,217,166,.2),rgba(255,234,99,.1));border-radius:24px;padding:2px;position:absolute;top:-2px;bottom:-2px;left:-2px;right:-2px;-webkit-mask-image:linear-gradient(#fff 0,#fff 0),linear-gradient(#fff 0,#fff 0);mask-image:linear-gradient(#fff 0,#fff 0),linear-gradient(#fff 0,#fff 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.about-container h1,.about-container h2,.about-container h3{color:#f5d9a6;font-family:Pixelscapes,serif;animation:1s ease-out forwards fadeInUp}.about-container h1{margin-bottom:20px;font-size:2.5rem}.about-container h2{margin-bottom:15px;font-size:1.8rem}.about-container h3{margin-bottom:10px;font-size:1.5rem}.about-container-contact{text-align:center;color:#f5d9a6;background:0 0;border:2px solid rgba(245,217,166,.4);border-radius:24px;flex-direction:column;gap:1.5rem;max-width:75vw;min-height:280px;margin:40px auto;padding:20px 30px;font-family:Pixelscapes,serif;animation:1s ease-out forwards fadeInUp;display:flex;position:relative;box-shadow:0 0 0 2px rgba(245,217,166,.3),0 8px 32px rgba(0,0,0,.8),inset 0 0 20px rgba(245,217,166,.05)}.about-container-contact:before{content:"";-webkit-mask-composite:xor;pointer-events:none;background:linear-gradient(135deg,rgba(245,217,166,.2),rgba(255,234,99,.1));border-radius:24px;padding:2px;position:absolute;top:-2px;bottom:-2px;left:-2px;right:-2px;-webkit-mask-image:linear-gradient(#fff 0,#fff 0),linear-gradient(#fff 0,#fff 0);mask-image:linear-gradient(#fff 0,#fff 0),linear-gradient(#fff 0,#fff 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.about-container-contact h1,.about-container-contact h2,.about-container-contact h3{color:#f5d9a6;margin:.5rem 0;font-family:Pixelscapes,serif;animation:1s ease-out forwards fadeInUp}.about-container-contact h1{margin-bottom:1rem;font-size:2.5rem}.about-container-contact h2{margin-bottom:.5rem;font-size:1.8rem}.about-container-contact h3{font-size:1.5rem}.about-container-contact p{margin:.5rem 0}.email-link{color:#f5d9a6;font-size:1.2rem;text-decoration:none;transition:color .3s}.email-link:hover{color:#ffea63;text-decoration:underline}.timezone-info{opacity:.8;margin-bottom:.5rem;font-size:1rem}.time-display{margin-top:.5rem;font-size:1.5rem;font-weight:700}.about-text{word-wrap:break-word;overflow-wrap:break-word;background-color:rgba(0,0,0,.3);border-radius:16px;max-width:50vw;margin:.5rem;padding:5px}@media (max-width:768px){.about-text{max-width:90%;margin:.5rem auto;padding:10px}}@media (max-width:480px){.about-text{max-width:95%;padding:8px;font-size:.9rem}}.About{color:#f5d9a6;font-size:2rem;font-weight:700;text-decoration:none;transition:color .3s}.aboutsection p{color:#333;margin:0 10px;font-size:1rem;display:inline-block}.blog-container{text-align:center;color:#f5d9a6;background:0 0;border:2px solid rgba(245,217,166,.4);border-radius:21px;flex-direction:column;max-width:75vw;min-height:auto;margin:40px auto;padding:20px 30px;font-family:Pixelscapes,serif;animation:1s ease-out forwards fadeInUp;display:flex;position:relative;overflow:visible;box-shadow:0 0 0 2px rgba(245,217,166,.3),0 8px 32px rgba(0,0,0,.8),inset 0 0 20px rgba(245,217,166,.05)}.blog-container:before{content:"";-webkit-mask-composite:xor;pointer-events:none;background:linear-gradient(135deg,rgba(245,217,166,.2),rgba(255,234,99,.1));border-radius:21px;padding:2px;position:absolute;top:-2px;bottom:-2px;left:-2px;right:-2px;-webkit-mask-image:linear-gradient(#fff 0,#fff 0),linear-gradient(#fff 0,#fff 0);mask-image:linear-gradient(#fff 0,#fff 0),linear-gradient(#fff 0,#fff 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.blog-container h1{color:#f5d9a6;word-wrap:break-word;overflow-wrap:break-word;margin-bottom:20px;font-family:Pixelscapes,serif;font-size:2rem;animation:1s ease-out forwards fadeInUp}.blog-container h3,.blog-container p{word-wrap:break-word;overflow-wrap:break-word}@media (max-width:768px){.blog-container{max-width:90vw;margin:20px auto;padding:15px 20px}.blog-container h1{margin-bottom:15px;font-size:1.5rem}.blog-container h3{font-size:1.2rem}}@media (max-width:480px){.blog-container{max-width:95vw;margin:15px auto;padding:12px 15px}.blog-container h1{margin-bottom:12px;font-size:1.3rem}.blog-container h3{font-size:1.1rem}}.blog-container .post-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;display:flex}@media (max-width:768px){.blog-container .post-row{flex-direction:column;align-items:flex-start;gap:.5rem}}.blog-container .post-date{color:#f5d9a6;text-align:right;flex:1;width:17rem;margin-right:3rem;font-size:1.4rem;display:inline-block}@media (max-width:768px){.blog-container .post-date{text-align:left;width:100%;margin-right:0;font-size:1.1rem}}@media (max-width:480px){.blog-container .post-date{font-size:1rem}}.blog-container .post-info{text-align:left;flex:1;min-width:0}@media (max-width:768px){.blog-container .post-info{width:100%}}.blog-container .post-link{color:#f5d9a6;text-align:left;word-wrap:break-word;overflow-wrap:break-word;font-size:1.4rem;font-weight:700;text-decoration:underline;transition:all .2s}.blog-container .post-link:hover{color:#ffea63;text-decoration:underline}@media (max-width:768px){.blog-container .post-link{font-size:1.1rem}}@media (max-width:480px){.blog-container .post-link{font-size:1rem}}.main-photo{border-radius:16px;width:340px;height:auto}.projects-container,.project,.navbar-container{text-align:center;color:#f5d9a6;background:0 0;border:2px solid rgba(245,217,166,.4);border-radius:24px;max-width:75vw;margin:40px auto;padding:20px 30px;font-family:Pixelscapes,serif;animation:1s ease-out forwards fadeInUp;position:relative;box-shadow:0 0 0 2px rgba(245,217,166,.3),0 8px 32px rgba(0,0,0,.8),inset 0 0 20px rgba(245,217,166,.05)}.projects-container:before,.project:before,.navbar-container:before{content:"";-webkit-mask-composite:xor;pointer-events:none;background:linear-gradient(135deg,rgba(245,217,166,.2),rgba(255,234,99,.1));border-radius:24px;padding:2px;position:absolute;top:-2px;bottom:-2px;left:-2px;right:-2px;-webkit-mask-image:linear-gradient(#fff 0,#fff 0),linear-gradient(#fff 0,#fff 0);mask-image:linear-gradient(#fff 0,#fff 0),linear-gradient(#fff 0,#fff 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.projects-container{text-align:center;flex-direction:row;justify-content:center;align-items:center;gap:2rem;margin:auto;display:flex}.project h2{color:#f5d9a6;font-family:Pixelscapes,serif;animation:1s ease-out forwards fadeInUp}.project-header{justify-content:center;align-items:center;gap:8px;display:flex}.code-block{color:#ddd;image-rendering:pixelated;word-wrap:break-word;white-space:pre-wrap;background:#222;border:2px solid #555;border-radius:16px;max-width:100%;padding:1rem;font-family:"Press Start 2P",monospace;font-size:12px;overflow-x:auto}@media (max-width:768px){.code-block{padding:.75rem;font-size:10px}}@media (max-width:480px){.code-block{border-radius:12px;padding:.5rem;font-size:8px}}.code-container{max-width:100%;margin:1rem 0;overflow-x:auto}@media (max-width:768px){.code-container{margin:.75rem 0}}@media (max-width:480px){.code-container{margin:.5rem 0}}.markdown-content{color:#f5d9a6;font-family:Pixelscapes,serif}.markdown-content h1,.markdown-content h2,.markdown-content h3,.markdown-content h4,.markdown-content h5,.markdown-content h6{color:#f5d9a6;margin:1.5rem 0 1rem;font-family:Pixelscapes,serif}.markdown-content h1{font-size:2.5rem}.markdown-content h2{font-size:1.8rem}.markdown-content h3{font-size:1.5rem}.markdown-content p{margin:1rem 0;line-height:1.6}.markdown-content code{background-color:rgba(0,0,0,.3);border-radius:4px;padding:.2rem .4rem;font-family:Monaco,Menlo,Ubuntu Mono,Consolas,source-code-pro,monospace;font-size:.9em}.markdown-content pre{margin:1.5rem 0}.markdown-content pre code{background-color:transparent;padding:0}.markdown-content strong{font-weight:700}.github-icon{cursor:pointer;width:40px;height:40px;image-rendering:pixelated;transition:transform .2s}@font-face{font-family:Pixelscapes;src:url(/fonts/Pixelscapes.ttf)}section{align-content:center;place-items:center;display:grid}@keyframes slideUpFromFloor{0%{opacity:0;transform:translateY(300px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes appear{0%{opacity:0;scale:.5}to{opacity:1;scale:1}}@keyframes spin{0%{transform:translateY(-50%)rotate(0)}to{transform:translateY(-50%)rotate(360deg)}}@media (max-width:768px){.nav{flex-direction:column;align-items:center;gap:1rem;padding:1rem}.nav ul{text-align:center;grid-template-columns:repeat(2,1fr);gap:.8rem;width:100%;max-width:300px;margin:0;padding:0;list-style:none;display:grid}.nav ul li{justify-content:center;align-items:center;display:flex}.nav ul a{background-color:rgba(0,0,0,.3);border-radius:16px;width:100%;padding:10px 0;display:block}.nav ul a.active{background-color:rgba(0,0,0,.5);font-weight:700}.nav>a{order:-1;margin-bottom:.5rem;font-size:1.5rem}.projects-container{grid-template-columns:repeat(2,1fr);justify-items:center;gap:1rem;max-width:90vw;margin:20px auto;padding:15px 20px;display:grid}.projects-container a{justify-content:center;align-items:center;display:flex}.projects-container .icon{width:60px;height:60px}.about-container{max-width:90vw;margin:20px auto;padding:15px 20px}.about-container h1{font-size:1.8rem}.about-container h2{font-size:1.4rem}.about-container h3{font-size:1.2rem}.about-container-contact{max-width:90vw;margin:20px auto;padding:15px 20px}}@media (max-width:480px){.about-container{max-width:95vw;margin:15px auto;padding:12px 15px}.about-container h1{font-size:1.5rem}.about-container h2{font-size:1.2rem}.about-container h3{font-size:1rem}.about-container-contact,.projects-container{max-width:95vw;margin:15px auto;padding:12px 15px}}.icon-large{width:80px;height:80px}@layer base{:root{--background:0 0% 100%;--foreground:20 14.3% 4.1%;--card:0 0% 100%;--card-foreground:20 14.3% 4.1%;--popover:0 0% 100%;--popover-foreground:20 14.3% 4.1%;--primary:24 9.8% 10%;--primary-foreground:60 9.1% 97.8%;--secondary:60 4.8% 95.9%;--secondary-foreground:24 9.8% 10%;--muted:60 4.8% 95.9%;--muted-foreground:25 5.3% 44.7%;--accent:60 4.8% 95.9%;--accent-foreground:24 9.8% 10%;--destructive:0 84.2% 60.2%;--destructive-foreground:60 9.1% 97.8%;--border:20 5.9% 90%;--input:20 5.9% 90%;--ring:20 14.3% 4.1%;--chart-1:12 76% 61%;--chart-2:173 58% 39%;--chart-3:197 37% 24%;--chart-4:43 74% 66%;--chart-5:27 87% 67%;--radius:.5rem}.dark{--background:20 14.3% 4.1%;--foreground:60 9.1% 97.8%;--card:20 14.3% 4.1%;--card-foreground:60 9.1% 97.8%;--popover:20 14.3% 4.1%;--popover-foreground:60 9.1% 97.8%;--primary:60 9.1% 97.8%;--primary-foreground:24 9.8% 10%;--secondary:12 6.5% 15.1%;--secondary-foreground:60 9.1% 97.8%;--muted:12 6.5% 15.1%;--muted-foreground:24 5.4% 63.9%;--accent:12 6.5% 15.1%;--accent-foreground:60 9.1% 97.8%;--destructive:0 62.8% 30.6%;--destructive-foreground:60 9.1% 97.8%;--border:12 6.5% 15.1%;--input:12 6.5% 15.1%;--ring:24 5.7% 82.9%;--chart-1:220 70% 50%;--chart-2:160 60% 45%;--chart-3:30 80% 55%;--chart-4:280 65% 60%;--chart-5:340 75% 55%}@apply border-border;@apply bg-background text-foreground;}
