html,body,#root{margin:0;padding:0;width:100%;height:100%;overflow:hidden}#game-container{width:100vw;height:100vh;position:fixed;top:0;left:0}#game-container canvas{width:100%!important;height:100%!important}@font-face{font-family:"Press Start 2P";font-style:normal;font-display:swap;font-weight:400;src:local("Press Start 2P Regular "),local("Press Start 2P-Regular"),url(/assets/press-start-2p-latin-400-tX-Ev6PG.woff2) format("woff2"),url(/assets/press-start-2p-latin-400-nxCJ0WVj.woff) format("woff")}@keyframes blink{0%{opacity:1}50%{opacity:0}to{opacity:1}}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}.container{box-sizing:border-box;position:absolute;width:100vw;height:100vh;top:0;left:0;background:url(/assets/background-image-Ryo92v2z.webp) no-repeat center/cover;border:clamp(16px,5vw,33px) solid #000;box-shadow:0 4px 4px #00000040;display:flex;flex-direction:column;justify-content:center;align-items:center}.window{background:#000000b3;padding:clamp(16px,5vw,40px);border-radius:10px;box-shadow:0 4px 15px #00000080;display:flex;flex-direction:column;align-items:center}.container h1{font-family:"Press Start 2P",cursive;font-size:clamp(1.5rem,6vw,3rem);color:#ff9526;text-align:center;margin-bottom:clamp(1rem,4vh,2rem)}.container button{margin-top:clamp(5vh,10vw,10vh);font-family:"Press Start 2P",cursive;font-size:clamp(1rem,4vw,1.5rem);color:#ff9526;background:none;border:none;cursor:pointer;border-radius:5px;padding:clamp(6px,2vh,10px) clamp(12px,4vw,20px);animation:blink 1.5s infinite,pulse 1s infinite;text-transform:uppercase}.hobby-page{position:fixed;top:0;right:0;bottom:0;left:0;background-image:url(/assets/images/terrain-de-foot.jpg);background-size:cover;background-position:center;background-color:#000c;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:clamp(16px,5vw,32px);text-align:center;overflow-y:auto;z-index:1000}.profile-container{display:flex;flex-direction:column;align-items:center;margin-bottom:clamp(16px,5vh,40px)}.profile-picture{width:clamp(100px,20vw,150px);height:clamp(100px,20vw,150px);border-radius:50%;object-fit:cover;margin-bottom:clamp(12px,5vh,24px);border:clamp(2px,.5vw,3px) solid white;box-shadow:0 4px 10px #0009}.hobby-page h1{font-size:clamp(1.5rem,6vw,2rem);margin-bottom:clamp(16px,5vh,32px);text-shadow:2px 2px 5px rgba(0,0,0,.8);color:#fff}.hobby-content{max-width:clamp(300px,80vw,800px);background-color:#00000080;padding:clamp(16px,4vw,32px);border-radius:clamp(6px,2vw,12px);text-align:justify;color:#fff;margin-bottom:clamp(16px,5vh,40px);line-height:1.8;box-shadow:0 4px 15px #0000004d}.close-button{position:absolute;top:clamp(12px,4vw,24px);right:clamp(12px,4vw,24px);width:clamp(32px,8vw,48px);height:clamp(32px,8vw,48px);background-color:#000000b3;color:#fff;border:none;border-radius:50%;font-size:clamp(16px,4vw,24px);font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 10px #0009;transition:all .3s ease}.close-button:hover{background-color:#f00c;transform:scale(1.1)}.cv-container{position:fixed;inset:50% auto auto 50%;transform:translate(-50%,-50%);width:clamp(300px,80vw,600px);background:#fff;border-radius:clamp(6px,2vw,10px);padding:clamp(16px,4vw,20px);box-shadow:0 4px 10px #0000004d;z-index:100;overflow-y:auto;max-height:80vh}.cv-content{text-align:left;display:flex;flex-direction:column;gap:clamp(12px,3vh,20px)}.cv-section{margin-bottom:clamp(12px,3vh,20px)}.cv-section h2{font-size:clamp(1.2rem,4vw,1.6rem);color:#333;border-bottom:clamp(1px,.2vh,2px) solid #204296;padding-bottom:clamp(4px,1vh,8px);margin-bottom:clamp(8px,2vh,12px)}.cv-section ul{list-style:none;padding:0;margin:0}.cv-section li{margin-bottom:clamp(6px,1.5vh,10px);font-size:clamp(.9rem,3vw,1.1rem);line-height:1.4}.close-btn{position:absolute;top:clamp(8px,2vh,10px);right:clamp(8px,2vw,10px);background:red;color:#fff;border:none;padding:clamp(4px,1.5vh,8px) clamp(6px,2vw,10px);font-size:clamp(14px,3vw,18px);cursor:pointer;border-radius:clamp(4px,1.5vw,5px)}.close-btn:hover{background:#8b0000}.projets-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-image:url(/assets/images/projet_background.webp);background-size:cover;background-position:center;background-repeat:no-repeat;display:flex;justify-content:center;align-items:center;overflow-y:auto;z-index:1000}.projets-container{width:clamp(90%,60vw,60%);padding:clamp(16px,4vw,32px);border-radius:clamp(6px,2vw,10px);text-align:center;position:relative;font-size:clamp(1rem,4vw,1.5rem);max-height:80vh;overflow-y:auto}.close-btn{position:absolute;top:clamp(8px,2vh,10px);right:clamp(12px,3vw,15px);background:none;border:none;font-size:clamp(1.2rem,4vw,1.8rem);cursor:pointer}.projets-list{display:flex;flex-direction:column;gap:clamp(12px,3vw,24px)}.project-card{background:#f5f5f5b3;padding:clamp(12px,3vw,24px);border-radius:clamp(6px,2vw,12px);box-shadow:0 4px 6px #0000001a;transition:transform .3s ease,box-shadow .3s ease}.project-card:hover{transform:scale(1.05);box-shadow:0 6px 12px #0003}.project-card h2{font-size:clamp(1.2rem,4vw,1.6rem);margin-bottom:clamp(4px,1vh,8px);color:#000}.project-card p{font-size:clamp(.9rem,3vw,1.1rem);margin-bottom:clamp(8px,2vh,12px);color:#000}.project-card a{display:inline-block;margin-top:clamp(4px,1vh,8px);font-size:clamp(.9rem,3vw,1.1rem);color:#007bff;text-decoration:none;font-weight:700}.project-card a:hover{text-decoration:underline}.contact-overlay{position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100vh;background:#000000b3;display:flex;justify-content:center;align-items:center;z-index:1000}.contact-content{position:relative;background:#fff;padding:clamp(16px,4vw,40px);border-radius:clamp(6px,2vw,12px);width:clamp(300px,90vw,500px);box-shadow:0 8px 24px #0003;overflow-y:auto;max-height:90vh}.close-btn{position:absolute;top:clamp(8px,2vw,15px);right:clamp(12px,3vw,20px);border:none;background:none;font-size:clamp(16px,4vw,32px);cursor:pointer;color:#333}.contact-content h2{margin-bottom:clamp(12px,3vh,20px);font-size:clamp(1.2rem,5vw,2rem);color:#204296;text-align:center}.contact-form{display:flex;flex-direction:column;gap:clamp(8px,2vh,15px)}.contact-form label{display:flex;flex-direction:column;font-weight:500;color:#333;font-size:clamp(.9rem,3vw,1.1rem)}.contact-form input,.contact-form textarea{margin-top:clamp(4px,1vh,8px);padding:clamp(8px,2vw,16px);border:1px solid #ccc;border-radius:clamp(4px,1.5vw,6px);font-size:clamp(.9rem,2.5vw,1rem);font-family:inherit}.submit-btn{margin-top:clamp(8px,2vh,12px);background-color:#204296;color:#fff;padding:clamp(10px,2vh,16px) clamp(20px,4vw,32px);border:none;border-radius:clamp(4px,1.5vw,6px);font-size:clamp(.9rem,2.5vw,1rem);font-weight:600;cursor:pointer;transition:background .3s}.submit-btn:hover{background-color:#183b7a}.status-msg{margin-top:clamp(8px,2vh,15px);font-size:clamp(.8rem,2.5vw,1rem);color:green;text-align:center}.contact-info{margin-top:clamp(12px,3vh,25px);font-size:clamp(.8rem,2.5vw,1rem);color:#555;line-height:1.4;text-align:center}.contact-info a{color:#204296;text-decoration:none;font-weight:600}.contact-info a:hover{text-decoration:underline}
