header{text-align:center;padding:4rem 2rem 2rem}header h1{font-size:3.5rem;color:#d4ff9d;margin-bottom:.5rem}.subtitle{font-size:1.25rem;color:#8fd6e8}main{flex:1;display:flex;align-items:flex-start;justify-content:center;padding:2rem}.project-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,350px));justify-content:center;gap:2rem;max-width:1200px;width:100%}.project-card{background-color:#d4ff9d0d;border:2px solid #D4FF9D;border-radius:1rem;padding:2rem;text-decoration:none;color:inherit;transition:all .3s ease;display:block}.project-card:hover{background-color:#d4ff9d1a;box-shadow:inset 0 0 1em #d4ff9d33,0 0 #fff,.3em .3em 2em #d4ff9d66;transform:translateY(-4px)}.card-content h2{font-size:2rem;color:#d4ff9d;margin-bottom:1rem}.card-content p{font-size:1.1rem;color:#f8f8f8;opacity:.9}.about-content{max-width:800px;margin:0 auto;text-align:center}.about-content p{font-size:1.2rem;line-height:1.6;margin-bottom:1.5rem;color:#f8f8f8}.links{display:flex;gap:1rem;justify-content:center;margin-top:2rem}.link-button{display:inline-block;padding:.75rem 1.5rem;background-color:#d4ff9d1a;border:2px solid #D4FF9D;border-radius:.5rem;color:#d4ff9d;text-decoration:none;transition:all .3s ease}.link-button:hover{background-color:#d4ff9d33;box-shadow:0 0 1em #d4ff9d66}@media(max-width:768px){header h1{font-size:2.5rem}.project-grid{grid-template-columns:1fr}.links{flex-direction:column;align-items:center}}.keyboard{width:50rem;display:flex;flex-direction:column;align-items:center;row-gap:.25rem}.keyboard.hidden{display:none}.row{display:flex;flex-direction:row;align-items:center;justify-content:center;width:100%;column-gap:.25rem}.single-key{display:flex;flex-direction:row;align-items:center;justify-content:center;width:3rem;aspect-ratio:1/1;font-size:1.5rem;color:#fff;background-color:#03131a;text-align:center;border:#D4FF9D solid 1px;border-radius:.5rem}.dual-key{display:flex;flex-direction:column;align-items:center;justify-content:center;width:3rem;aspect-ratio:1/1;font-size:1rem;color:#fff;background-color:#03131a;text-align:center;border:#D4FF9D solid 1px;border-radius:.5rem}.rectangle-x-sm{display:flex;flex-direction:row;align-items:center;justify-content:center;width:3rem;height:3rem;font-size:1rem;color:#fff;background-color:#03131a;text-align:center;border:#D4FF9D solid 1px;border-radius:.5rem}.rectangle-sm{display:flex;flex-direction:row;align-items:center;justify-content:center;width:4rem;height:3rem;font-size:1rem;color:#fff;background-color:#03131a;text-align:center;border:#D4FF9D solid 1px;border-radius:.5rem}.rectangle-med{display:flex;flex-direction:row;align-items:center;justify-content:center;width:5rem;height:3rem;font-size:1rem;color:#fff;background-color:#03131a;text-align:center;border:#D4FF9D solid 1px;border-radius:.5rem}.rectangle-lg{display:flex;flex-direction:row;align-items:center;justify-content:center;width:6.5rem;height:3rem;font-size:1rem;color:#fff;background-color:#03131a;text-align:center;border:#D4FF9D solid 1px;border-radius:.5rem}.rectangle-x-lg{display:flex;flex-direction:row;align-items:center;justify-content:center;width:17rem;height:3rem;font-size:1rem;color:#fff;background-color:#03131a;text-align:center;border:#D4FF9D solid 1px;border-radius:.5rem}.hands{display:flex;flex-direction:row;column-gap:3rem;margin-top:1rem}.left-hand,.right-hand{display:flex;flex-direction:row;align-items:flex-end;column-gap:.35rem}.finger{background-color:#d4ff9d;border-top-left-radius:20px;border-top-right-radius:20px;opacity:.5}.active-finger{background-color:#8fd6e8;opacity:1}.finger-1{width:3.5rem;height:4rem}.finger-2{width:3rem;height:10rem}.finger-3{width:3rem;height:12rem}.finger-4{width:3rem;height:11rem}.finger-5{width:3rem;height:6rem}.keytype-container{background-color:#03131a;margin:0;padding:2rem 1rem;display:flex;flex-direction:column;align-items:center;row-gap:1rem;min-height:100vh}.cursor{background-color:#8fd6e8}.done{color:gray}.hidden{display:none}.enter-icon{display:initial!important}#header{font-size:3rem;color:#f8f8f8;margin-bottom:0}#typing{outline:none;width:40rem;max-width:90vw;min-height:8rem;font-size:1.5rem;line-height:1.4;color:#f8f8f8;border:1px solid #D4FF9D;border-radius:.5rem;padding:2rem;box-shadow:inset 0 0 1em #d4ff9d4d,0 0 #fff,.3em .3em 2em #d4ff9d99;white-space:pre-wrap;word-wrap:break-word}#typing:focus,#typing:focus-visible{outline:none}@keyframes error-pulse{0%{box-shadow:inset 0 0 1em #d4ff9d4d,0 0 #fff,.3em .3em 2em #d4ff9d99}35%{box-shadow:inset 0 0 1em #ff6b6b59,0 0 #fff,.3em .3em 2em #ff6b6bb3}to{box-shadow:inset 0 0 1em #d4ff9d4d,0 0 #fff,.3em .3em 2em #d4ff9d99}}.error-pulse{animation:error-pulse .25s ease-out}@media(prefers-reduced-motion:reduce){.error-pulse{animation-duration:1ms}}#stats{font-size:1.5rem;color:#f8f8f8}#startGameBtn{font-size:1.5rem;border-radius:.5rem;border:1px solid #D4FF9D;background-color:#03131a;color:#f8f8f8;padding:.5rem 1rem;cursor:pointer}#toggleKeyboardBtn{font-size:1rem;border-radius:.5rem;border:1px solid #D4FF9D;background-color:#03131a;color:#f8f8f8;padding:.5rem 1rem;cursor:pointer}#stopGameBtn{font-size:1rem;border-radius:.5rem;border:1px solid #FF6B6B;background-color:#03131a;color:#f8f8f8;padding:.5rem 1rem;cursor:pointer}#stopGameBtn:hover{background-color:#ff6b6b;color:#03131a;box-shadow:inset 0 0 1em #ff6b6b4d,0 0 #fff,.3em .3em 2em #ff6b6b99}#toggleKeyboardBtn:hover{background-color:#8fd6e8;color:#03131a;box-shadow:inset 0 0 1em #d4ff9d4d,0 0 #fff,.3em .3em 2em #d4ff9d99}#backHomeBtn{font-size:1.5rem;border-radius:.5rem;border:1px solid #D4FF9D;background-color:#03131a;color:#f8f8f8;padding:.5rem 1rem;cursor:pointer}#startGameBtn:hover,#backHomeBtn:hover{background-color:#8fd6e8;color:#03131a;box-shadow:inset 0 0 1em #d4ff9d4d,0 0 #fff,.3em .3em 2em #d4ff9d99}.active-key{background-color:#8fd6e8}.mario-online-container{width:100%;min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;background:#222;gap:1rem}.mario-online-container canvas{border:1px solid #cccccc}.mario-online-controls{display:flex;gap:2rem;color:#ccc;font-family:monospace;font-size:.9rem}.mario-online-controls span{white-space:nowrap}.asteroids-container{width:100%;min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;background:#03131a;gap:1rem;padding:2rem 1rem}.asteroids-hud{display:flex;gap:2rem;color:#d4ff9d;font-family:monospace;font-size:1.1rem;letter-spacing:.05em}.asteroids-canvas-wrap{position:relative;line-height:0}.asteroids-canvas-wrap canvas{display:block;max-width:90vw;border:2px solid #D4FF9D;border-radius:.5rem;box-shadow:.3em .3em 2em #d4ff9d33;background:#000}.asteroids-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;background:#03131abf;color:#f8f8f8;font-family:monospace;text-align:center}.asteroids-overlay p{margin:0;font-size:1.8rem;letter-spacing:.1em}.asteroids-overlay-score{font-size:1.1rem!important;color:#8fd6e8}.asteroids-controls{display:flex;gap:2rem;color:#8fd6e8;font-family:monospace;font-size:.9rem;flex-wrap:wrap;justify-content:center}.asteroids-controls span{white-space:nowrap}.asteroids-buttons{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center}#asteroidsStartBtn,#asteroidsBackBtn{font-size:1rem;border-radius:.5rem;border:1px solid #D4FF9D;background-color:#03131a;color:#f8f8f8;padding:.5rem 1rem;cursor:pointer}#asteroidsStartBtn:hover,#asteroidsBackBtn:hover{background-color:#8fd6e8;color:#03131a;box-shadow:inset 0 0 1em #d4ff9d4d,0 0 #fff,.3em .3em 2em #d4ff9d99}#asteroidsStopBtn{font-size:1rem;border-radius:.5rem;border:1px solid #FF6B6B;background-color:#03131a;color:#f8f8f8;padding:.5rem 1rem;cursor:pointer}#asteroidsStopBtn:hover{background-color:#ff6b6b;color:#03131a;box-shadow:inset 0 0 1em #ff6b6b4d,0 0 #fff,.3em .3em 2em #ff6b6b99}@media(max-width:600px){.asteroids-hud{font-size:.9rem;gap:1rem}.asteroids-controls{gap:1rem}}*{margin:0;padding:0;box-sizing:border-box}body{background-color:#03131a;color:#f8f8f8;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.6;min-height:100vh;display:flex;flex-direction:column}#root{min-height:100vh;display:flex;flex-direction:column}