.home-page{min-height:100vh;background:#fefefa;display:flex;align-items:center;justify-content:center;position:relative}.menu-label{position:absolute;left:60px;top:50%;transform:translateY(-50%);font-family:Inter,sans-serif;font-size:14px;color:#666;writing-mode:vertical-rl;text-orientation:mixed;letter-spacing:3px}.home-menu{display:flex;flex-direction:column;gap:0;align-items:center}.home-link{font-family:Pixelify Sans,sans-serif;font-size:56px;font-weight:700;color:#1a1a1a;text-decoration:none;padding:20px 40px;transition:all .3s ease;letter-spacing:2px;text-align:center}.home-link:hover{color:#666;transform:scale(1.05)}@media(max-width:768px){.menu-label{position:static;writing-mode:horizontal-tb;margin-bottom:40px;transform:none}.home-page{flex-direction:column;justify-content:center;padding:40px 20px}.home-link{font-size:36px}}.about-page{min-height:100vh;background:#fefefa;padding:80px 40px;display:flex;align-items:center;justify-content:center}.about-window{max-width:1400px;width:100%;background:#fff;border:2px solid #1a1a1a;position:relative;animation:gentleFloat 3s ease-in-out infinite;padding:60px;box-shadow:6px 6px #000}@keyframes gentleFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-15px)}}.close-btn{position:absolute;top:20px;right:20px;width:50px;height:50px;border:2px solid #1a1a1a;background:#fff;font-size:24px;cursor:pointer;transition:all .2s;font-family:Pixelify Sans,sans-serif;z-index:10}.close-btn:hover{background:#1a1a1a;color:#fff}.about-layout{display:flex;gap:60px;align-items:flex-start}.about-photo{flex-shrink:0;width:350px}.about-photo img{width:100%;height:auto;display:block;border-radius:12px}.about-text{flex:1}.about-text h1{font-family:Pixelify Sans,sans-serif;font-size:56px;margin-bottom:40px;font-weight:700;color:#1a1a1a;letter-spacing:1px}.about-text p{font-family:Inter,sans-serif;font-size:19px;line-height:1.8;color:#333;margin-bottom:30px;font-weight:400}@media(max-width:968px){.about-page{padding:100px 20px}.about-window{padding:40px 30px}.about-layout{flex-direction:column;gap:40px}.about-photo{width:100%;max-width:350px}.about-text h1{font-size:40px}.about-text p{font-size:17px}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.6;color:#1a1a1a;background:#fefefa;min-height:100vh;cursor:url(/images/cursor-arrow.png?v=2) 0 0,auto}button,a,.project-card,.tab{cursor:url(/images/cursor-pointer.png?v=2) 8 0,pointer!important}.boot-animation{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#1a1a1a;display:flex;justify-content:center;align-items:center;z-index:9999;animation:fadeOut .5s ease 2.5s forwards}.boot-animation img{max-width:80%;max-height:80%;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges}@keyframes fadeOut{to{opacity:0}}header{position:fixed;top:40px;right:40px;z-index:1000;background:transparent}header h2{display:none}nav ul{list-style:none;display:flex;gap:30px}nav a{font-family:Pixelify Sans,sans-serif;text-decoration:none;color:#1a1a1a;font-size:28px;font-weight:500;letter-spacing:.5px;transition:all .2s;text-transform:uppercase}nav a:hover{color:#666;transform:scale(1.05)}main{padding:100px 40px 40px;max-width:1400px;margin:0 auto}#projects h2,#contact h2{font-family:Pixelify Sans,sans-serif;font-size:26px;margin-bottom:40px;font-weight:700;color:#1a1a1a;text-transform:uppercase}.project-tabs{display:flex;gap:0;margin-bottom:30px;border-bottom:4px solid #1a1a1a}.tab{font-family:Pixelify Sans,sans-serif;padding:15px 30px;background:#fff;border:4px solid #1a1a1a;border-bottom:none;cursor:pointer;font-size:16px;font-weight:600;transition:all .2s;position:relative;top:4px}.tab:not(:first-child){border-left:none}.tab.active{background:#1a1a1a;color:#fff}.tab:hover:not(.active){background:#f5f5f5}.project-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(450px,1fr));gap:40px;margin-bottom:80px}.project-grid:has(>:last-child:nth-child(odd))>:last-child{grid-column:1 / -1}.project-card{border:2px solid #1a1a1a;overflow:hidden;position:relative;background:#fff;box-shadow:6px 6px #000;transition:transform .3s ease}.project-card:hover{animation:bounce .6s ease}@keyframes bounce{0%,to{transform:translateY(0)}25%{transform:translateY(-10px)}50%{transform:translateY(-5px)}75%{transform:translateY(-7px)}}.category-badge{position:absolute;top:20px;right:20px;padding:8px 16px;border:2px solid #1a1a1a;background:#fff;font-family:Pixelify Sans,sans-serif;font-size:13px;font-weight:600;z-index:10}.project-card img{width:100%;height:280px;object-fit:cover;border-bottom:2px solid #1a1a1a;display:block}.project-card.game-design img{background:linear-gradient(135deg,#ffb6c1,pink)}.project-card.programming img{background:linear-gradient(135deg,#b0e0e6,#87ceeb)}.project-card.art img{background:linear-gradient(135deg,#ffe4b5,#ffdab9)}.project-card img[src*="characters.png"],.project-card img[src*="portfolio.png"],.project-card img[src*="fortunesinthedark.png"]{content:"";background-size:cover}.project-card>h3,.project-card>p,.project-card>.tech-stack,.project-card>.links{padding:0 30px}.project-card h3{font-family:Pixelify Sans,sans-serif;font-size:22px;margin:25px 30px 15px;font-weight:700;line-height:1.5;color:#1a1a1a}.project-card>p{font-family:Inter,sans-serif;color:#666;margin-bottom:20px;font-size:17px;line-height:1.7}.tech-stack{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:25px}.tech-tag{font-family:Pixelify Sans,sans-serif;background:#fff;color:#1a1a1a;padding:8px 16px;border:2px solid #1a1a1a;font-size:14px;font-weight:500;transition:all .2s}.tech-tag:hover{background:#1a1a1a;color:#fff}.links{display:flex;gap:15px;padding:25px 30px 30px;border-top:2px solid #e8e8e8}.links a{text-decoration:none;color:#1a1a1a;background:#fff;padding:12px 24px;border:2px solid #1a1a1a;font-size:14px;font-weight:600;transition:all .2s;font-family:Pixelify Sans,sans-serif;text-transform:uppercase}.links a:hover{background:#1a1a1a;color:#fff}#contact{border:2px solid #1a1a1a;padding:60px;text-align:center;background:#fff;position:relative;box-shadow:6px 6px #000}#contact h2{font-family:Pixelify Sans,sans-serif;font-size:26px;margin-bottom:20px;font-weight:700;position:relative;z-index:1;text-transform:uppercase}#contact p{font-family:Inter,sans-serif;font-size:18px;color:#666;margin-bottom:40px;position:relative;z-index:1}.contact-links{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;position:relative;z-index:1}.contact-links a{text-decoration:none;color:#1a1a1a;background:#fff;padding:16px 32px;border:2px solid #1a1a1a;font-size:16px;font-weight:600;transition:all .2s;font-family:Pixelify Sans,sans-serif;text-transform:uppercase}.contact-links a:hover{background:#1a1a1a;color:#fff}@media(max-width:768px){header{position:relative;top:0;right:0;margin-bottom:40px}nav ul{flex-direction:column;gap:10px}main{padding:20px}#contact{padding:30px 20px}#projects h2,#contact h2{font-size:20px}.project-grid{grid-template-columns:1fr}.project-card h3{font-size:18px}}html{scroll-behavior:auto;overflow-x:hidden}body{overflow-x:hidden}.App{min-height:100vh;position:relative}.modal-overlay{position:fixed;inset:0;background:#000000b3;display:flex;justify-content:center;align-items:center;z-index:2000;padding:20px;overflow-y:auto}.modal-content{background:#fff;border:2px solid #1a1a1a;box-shadow:8px 8px #000;max-width:800px;width:100%;max-height:90vh;overflow-y:auto;position:relative;animation:modalSlideIn .3s ease}@keyframes modalSlideIn{0%{transform:translateY(-50px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-close{position:absolute;top:20px;right:20px;background:#fff;border:2px solid #1a1a1a;width:40px;height:40px;font-size:28px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-family:Pixelify Sans,sans-serif;transition:all .2s;z-index:10}.modal-close:hover{background:#1a1a1a;color:#fff}.modal-header{padding:40px 40px 20px;border-bottom:2px solid #e8e8e8}.modal-header h2{font-family:Pixelify Sans,sans-serif;font-size:32px;margin:0;color:#1a1a1a}.modal-body{padding:40px}.modal-image-container{width:100%;margin-bottom:30px;border:2px solid #1a1a1a}.modal-image-container img{width:100%;height:400px;object-fit:cover;display:block}.modal-description,.modal-tech,.modal-detailed,.modal-highlights{margin-bottom:30px}.modal-description h3,.modal-tech h3,.modal-detailed h3,.modal-highlights h3{font-family:Pixelify Sans,sans-serif;font-size:20px;margin-bottom:15px;color:#1a1a1a;text-transform:uppercase}.modal-description p,.modal-detailed p{font-family:Inter,sans-serif;font-size:17px;line-height:1.8;color:#666}.modal-highlights ul{list-style:none;padding:0}.modal-highlights li{font-family:Inter,sans-serif;font-size:17px;line-height:1.8;color:#666;padding-left:25px;position:relative;margin-bottom:10px}.modal-highlights li:before{content:"▸";position:absolute;left:0;color:#1a1a1a;font-weight:700}.modal-tech .tech-stack{display:flex;flex-wrap:wrap;gap:10px}.modal-links{display:flex;gap:15px;padding-top:20px;border-top:2px solid #e8e8e8}.modal-links a{text-decoration:none;color:#1a1a1a;background:#fff;padding:12px 24px;border:2px solid #1a1a1a;font-size:14px;font-weight:600;transition:all .2s;font-family:Pixelify Sans,sans-serif;text-transform:uppercase}.modal-links a:hover{background:#1a1a1a;color:#fff}@media(max-width:768px){.modal-content{max-height:95vh}.modal-header,.modal-body{padding:20px}.modal-header h2{font-size:24px}.modal-image-container img{height:250px}}.project-detail-page{min-height:100vh;padding:20px 40px 40px}.project-detail-container{max-width:1100px;margin:0 auto}.back-button{background:#fff;border:2px solid #1a1a1a;padding:12px 24px;font-family:Pixelify Sans,sans-serif;font-size:14px;cursor:pointer;margin-bottom:50px;transition:all .2s;text-transform:uppercase}.back-button:hover{background:#1a1a1a;color:#fff}.project-detail-header{margin-bottom:40px}.project-detail-header h1{font-family:Pixelify Sans,sans-serif;font-size:64px;color:#1a1a1a;margin:0;line-height:1.2}.project-detail-image{width:100%;margin-bottom:60px;margin-top:20px}.project-detail-image img{width:100%;height:auto;display:block;border:none;border-radius:12px}.project-meta-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:60px;margin-bottom:20px}.project-meta-column{display:flex;flex-direction:column;gap:40px}.meta-section h3{font-family:Pixelify Sans,sans-serif;font-size:16px;color:#1a1a1a;text-transform:uppercase;margin-bottom:15px;letter-spacing:1px}.meta-section p{font-family:Inter,sans-serif;font-size:16px;line-height:1.8;color:#333;margin:0}.tools-list{display:flex;flex-wrap:wrap;gap:8px}.tool-item{font-family:Inter,sans-serif;font-size:14px;color:#666;background:#f5f5f5;padding:6px 12px;border-radius:4px}.team-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:8px 16px}.team-list li{font-family:Inter,sans-serif;font-size:16px;line-height:1.8;color:#333;white-space:nowrap}.team-name{font-weight:600}.team-role{color:#666}.project-wireframes{margin-top:80px;margin-bottom:80px}.project-wireframes h2{font-family:Pixelify Sans,sans-serif;font-size:64px;color:#1a1a1a;margin-bottom:40px;text-transform:uppercase}.wireframes-grid{display:grid;grid-template-columns:1fr;gap:40px}.wireframe-item img{width:100%;height:auto;display:block;border-radius:12px}.wireframe-caption{font-family:Inter,sans-serif;font-size:14px;color:#666;margin-top:10px;text-align:center}.coming-soon{font-family:Inter,sans-serif;font-size:16px;color:#999;font-style:italic}.project-gallery{margin-top:80px;margin-bottom:60px}.project-gallery h2{font-family:Pixelify Sans,sans-serif;font-size:28px;color:#1a1a1a;margin-bottom:40px;text-transform:uppercase}.gallery-grid{display:grid;grid-template-columns:1fr;gap:40px}.gallery-item img,.gallery-item video{width:100%;height:auto;display:block;border-radius:12px}.gallery-caption{font-family:Inter,sans-serif;font-size:14px;color:#666;margin-top:10px;text-align:center}.project-links-section{display:flex;gap:15px;margin-top:60px;padding-top:40px;border-top:2px solid #e8e8e8}.project-link-btn{text-decoration:none;color:#1a1a1a;background:#fff;padding:16px 32px;border:2px solid #1a1a1a;font-size:16px;font-weight:600;transition:all .2s;font-family:Pixelify Sans,sans-serif;text-transform:uppercase}.project-link-btn:hover{background:#1a1a1a;color:#fff}.project-not-found{text-align:center;padding:100px 20px}.project-not-found h2{font-family:Pixelify Sans,sans-serif;font-size:32px;margin-bottom:30px}@media(max-width:768px){.project-detail-page{padding:40px 20px 20px}.project-detail-header h1{font-size:32px}.project-meta-grid{grid-template-columns:1fr;gap:40px}.project-links-section{flex-direction:column}.project-link-btn{text-align:center}}.loading-screen{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#fefefa;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:9999}.loading-gif{max-width:100%;max-height:80vh;object-fit:contain;animation:pixelWalk 3s linear infinite alternate;margin-bottom:50px}.loading-content{display:flex;flex-direction:column;align-items:center}.loading-text{font-family:Pixelify Sans,sans-serif;font-size:32px;font-weight:700;color:#1a1a1a;letter-spacing:6px;margin-bottom:15px}.loading-bar-container{width:316px;height:44px;border:6px solid #1a1a1a;padding:4px;background:transparent}.loading-bar-fill{height:100%;background-image:repeating-linear-gradient(to right,#1a1a1a 0px,#1a1a1a 24px,transparent 24px,transparent 30px);background-size:300px 100%;background-repeat:no-repeat;width:0%;animation:loadingProgress 3s steps(10,end) forwards}@keyframes loadingProgress{0%{width:0%}to{width:100%}}@keyframes pixelWalk{0%{transform:translate(-5.5vw)}to{transform:translate(5.5vw)}}
