@import"https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap";body{overflow:hidden}body.loaded{overflow:auto}.preloader{position:fixed;top:0;left:0;width:100%;height:100%;background:#000;display:flex;justify-content:center;align-items:center;z-index:99999;transition:opacity .5s ease-out}.preloader.fade-out{opacity:0;pointer-events:none}.preloader-spinner{width:50px;height:50px;border:4px solid rgba(92,230,142,.2);border-top-color:#5ce68e;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}:root{font-family:Space Grotesk,Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#e9ecf4;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*,*:before,*:after{box-sizing:border-box}body{margin:0;min-height:100vh;background:#010409}.artwork-hero{position:relative;width:100vw;height:100vh;background:#010409;display:flex;align-items:center;justify-content:center;overflow:hidden}.artwork-hero:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 20% 30%,rgba(255,255,255,.08),transparent 45%),radial-gradient(circle at 80% 50%,rgba(255,237,213,.12),transparent 40%);animation:shimmer 40s ease-in-out infinite alternate}.artwork-hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center;background-color:#010409;filter:saturate(1.05) contrast(1.05);clip-path:inset(12% 0% 12% 0%)}.artwork-hero__overlay{position:absolute;inset:0;background:radial-gradient(circle at center,transparent 35%,rgba(1,4,9,.82));pointer-events:none}.game-overlay{position:fixed;inset:0;background:#020617d9;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .2s ease;z-index:10}.game-overlay__close{display:none}.game-overlay__close:hover{transform:scale(1.05);background:#010409e6}.game-overlay.is-visible{opacity:1;visibility:visible}.game-shell{width:100%;height:100%;background:#010409;display:flex;flex-direction:column}#app{width:100%;flex:1;background:#030712}.touch-hint{position:absolute;top:1rem;right:1rem;margin:0;padding:.6rem 1rem;text-align:right;font-family:monospace;font-size:.75rem;color:#ffffffb3;background:#0006;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:8px;border:1px solid rgba(92,230,142,.2);display:none;z-index:50;max-width:280px;line-height:1.4}@media(max-aspect-ratio:16/9){.artwork-hero__video{width:auto;height:100%}}@media(max-width:768px){.artwork-hero{height:100vh;padding:0}.artwork-hero__video{width:100%;height:100%;object-fit:cover;object-position:center;clip-path:inset(12% 0% 12% 0%)}.artwork-hero__overlay{background:radial-gradient(circle at center,transparent 15%,rgba(1,4,9,.92))}.game-shell{padding:.15rem;overflow:hidden}#app{overflow:hidden;display:flex;align-items:center;justify-content:center}#app canvas{max-width:100%;max-height:100%;object-fit:contain}}@media(max-width:768px)and (orientation:landscape){.artwork-hero{height:100vh}.artwork-hero__video{object-fit:contain;object-position:center;clip-path:inset(12% 0% 12% 0%)}.artwork-hero__overlay{background:radial-gradient(circle at center,transparent 35%,rgba(1,4,9,.85))}#game-overlay canvas{max-width:calc(100vw - 20px);max-height:calc(100vh - 40px)}}@keyframes shimmer{0%{opacity:.15}to{opacity:.4}}.portfolio-modal{position:fixed;inset:0;background:#000000e6;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:all .3s ease;z-index:100}.portfolio-modal.open{opacity:1;visibility:visible}.modal-content{background:linear-gradient(135deg,#1a1a2e,#16213e);border:2px solid rgba(255,255,255,.1);border-radius:16px;padding:2rem;max-width:600px;width:90%;max-height:80vh;overflow-y:auto;position:relative;box-shadow:0 20px 60px #00000080;transform:scale(.9);transition:transform .3s ease}.portfolio-modal.open .modal-content{transform:scale(1)}.modal-close{position:absolute;top:1rem;right:1rem;background:#ffffff1a;border:none;color:#fff;width:50px;height:50px;border-radius:50%;font-size:1.5rem;cursor:pointer;transition:background .2s;display:flex;align-items:center;justify-content:center;padding:0;touch-action:manipulation;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none;z-index:1000}.modal-close:before{content:"";position:absolute;inset:-10px;border-radius:50%}@media(hover:hover){.modal-close:hover{background:#fff3;transform:rotate(90deg)}}.modal-close:active{background:#ffffff4d;transform:scale(.95)}.modal-content h2{margin-top:0;color:#fff;font-size:2rem}.projects-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:start}.projects-column{display:flex;flex-direction:column;gap:0}.projects-column-title{font-family:monospace;font-size:1.5rem;color:#5ce68e;margin:0 0 1.5rem;padding-bottom:.5rem;border-bottom:2px solid rgba(92,230,142,.3);font-weight:600;letter-spacing:1px}@media(max-width:1024px){.projects-grid{grid-template-columns:1fr}}.project-card{margin-bottom:2.5rem;padding:1.5rem;background:#ffffff05;border-radius:12px;border-left:3px solid #5CE68E}.project-card h3{font-family:monospace;font-size:1.4rem;color:#5ce68e;margin:0 0 1rem;font-weight:600}.project-description{color:#ffffffe6;line-height:1.7;font-size:clamp(1rem,.95rem + .35vw,1.05rem);margin-bottom:1rem}.tech-badges{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0}.tech-badge{background:#5ce68e26;color:#5ce68e;padding:.4rem .8rem;border-radius:6px;font-size:.85rem;font-weight:500;border:1px solid rgba(92,230,142,.3)}.project-features{color:#ffffffb3;font-size:.9rem;margin:1rem 0;font-style:italic}.project-link{display:inline-block;color:#5ce68e;text-decoration:none;font-weight:600;margin-top:.5rem;transition:all .2s ease}.project-link:hover{color:#7ef4a9;transform:translate(5px)}.modal-content h2.contact-title,.modal-content h2.about-title,.modal-content h2.experience-title,.modal-content h2.projects-title{color:#5ce68e}.modal-content p{color:#fffc;line-height:1.6}.modal-content ul{list-style:none;padding:0}.modal-content li{padding:.5rem 0;color:#fffc;border-bottom:1px solid rgba(255,255,255,.1)}.modal-content li:last-child{border-bottom:none}.modal-content--about{max-width:1500px}.about-title{font-family:monospace;font-size:clamp(2rem,3vw,3rem);color:#5ce68e;margin-bottom:2rem;text-align:center;font-weight:400;letter-spacing:2px;animation:titleGlow .6s ease-in-out infinite alternate}.about-container{display:flex;gap:3rem;align-items:center}.about-content{flex:1}.about-profile{flex-shrink:0}.about-profile-image{width:400px;height:500px;border-radius:8px;object-fit:cover;border:4px solid #5CE68E;transition:all .3s ease}.about-profile-image:hover{transform:scale(1.02)}@media(max-width:900px){.about-container{flex-direction:column}.about-profile{align-self:center;position:static}.about-profile-image{width:200px;height:200px}}.about-section{margin-bottom:2rem;padding:1.5rem;background:#ffffff05;border-radius:12px;border-left:3px solid #5CE68E}.about-section-title{font-family:monospace;font-size:1.3rem;color:#5ce68e;margin-top:0;margin-bottom:1rem;font-weight:600}.about-text{color:#ffffffe6;line-height:1.8;font-size:clamp(1rem,.95rem + .4vw,1.1rem);margin:0}.about-text strong{color:#5ce68e;font-weight:600}.modal-content--experience,.modal-content--projects{max-width:2000px}.projects-title,.experience-title{font-family:monospace;font-size:clamp(2rem,3vw,3rem);color:#5ce68e;margin:0 0 2rem;text-align:center;font-weight:400;letter-spacing:2px;animation:titleGlow .6s ease-in-out infinite alternate}.experience-item{margin-bottom:2.5rem;padding:1.5rem;background:#ffffff05;border-radius:12px;border-left:3px solid #5CE68E}.experience-header{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:.5rem;margin-bottom:.5rem}.experience-role{font-family:monospace;font-size:1.4rem;color:#5ce68e;margin:0;font-weight:600}.experience-company{font-family:monospace;font-size:1.1rem;color:#5ce68ecc;font-weight:500}.experience-period{color:#fff9;font-size:.95rem;margin:0 0 1rem;font-style:italic}.experience-description{list-style:none;padding:0;margin:0}.experience-description li{color:#ffffffe6;line-height:1.7;font-size:clamp(1rem,.95rem + .35vw,1.05rem);margin-bottom:.75rem;padding-left:1.5rem;position:relative}.experience-description li:before{content:"•";color:#5ce68e;font-size:1.2rem;position:absolute;left:0}.experience-description li strong{color:#5ce68e;font-weight:600}.experience-logo{height:45px;width:auto;object-fit:contain}.experience-logo--inline{height:65px}.experience-tech{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem;padding-top:1rem;border-top:1px solid rgba(92,230,142,.2)}.tech-badge{display:inline-block;padding:.4rem .8rem;background:#5ce68e1a;border:1px solid rgba(92,230,142,.3);border-radius:6px;color:#5ce68e;font-size:.85rem;font-family:monospace;font-weight:500;transition:all .2s ease}.tech-badge:hover{background:#5ce68e33;border-color:#5ce68e80;transform:translateY(-2px)}.tech-stack{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}.modal-content--contact{text-align:center}.contact-title{font-family:monospace;font-size:56px;color:#5ce68e;margin-bottom:1.5rem;font-weight:400;letter-spacing:2px;animation:titleGlow 1.2s ease-in-out infinite alternate}@keyframes titleGlow{0%{opacity:.35}to{opacity:1}}.contact-description{color:#ffffffe6;line-height:1.8;margin-bottom:2rem;font-size:1.3rem}.contact-buttons{display:flex;gap:1rem;justify-content:center;align-items:center;flex-wrap:wrap}.contact-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;padding:1rem;background:#5ce68e1a;border:2px solid #5CE68E;border-radius:50%;color:#5ce68e;text-decoration:none;font-family:monospace;font-size:16px;font-weight:600;transition:all .3s ease;width:60px;height:60px}.contact-btn:hover{background:#5ce68e33;transform:translateY(-4px);box-shadow:0 8px 24px #5ce68e4d}.contact-btn:active{transform:translateY(-2px)}.contact-btn__icon{width:2rem;height:2rem;filter:brightness(0) saturate(100%) invert(81%) sepia(18%) saturate(1154%) hue-rotate(83deg) brightness(96%) contrast(91%)}.contact-btn:hover .contact-btn__icon{filter:brightness(0) saturate(100%) invert(81%) sepia(18%) saturate(1154%) hue-rotate(83deg) brightness(110%) contrast(91%)}@media(max-width:768px){.modal-content{width:95%;padding:1.25rem}.modal-content h2{font-size:1.5rem}.about-title,.experience-title{font-size:clamp(1.5rem,5vw,2rem)!important;margin-bottom:1.5rem}.contact-title{font-size:36px!important;margin-bottom:1rem}.contact-description{font-size:.7rem;line-height:1.5}.about-container{flex-direction:column;gap:1.5rem;align-items:center}.about-content,.about-profile{width:100%}.about-profile-image{width:min(260px,70vw);height:min(320px,75vw);margin:0 auto;display:block}.about-section{padding:1rem;margin-bottom:1.5rem}.about-section-title{font-size:.8rem}.about-text{font-size:.65rem!important;line-height:1.5}.experience-header{flex-direction:column;align-items:flex-start}.experience-logo--inline{align-self:flex-start;margin-top:.5rem;height:50px}.experience-role{font-size:1.1rem}.experience-period{font-size:.8rem}.experience-description li{font-size:.85rem;line-height:1.5}.tech-badge{font-size:.7rem;padding:.3rem .5rem}.experience-item{padding:1rem;margin-bottom:1.5rem}.project-card h3{font-size:1.2rem}.project-description{font-size:.85rem;line-height:1.5}.project-features{font-size:.75rem}}
