*,:before,:after{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{-webkit-font-smoothing:antialiased;font-family:Pixelify Sans,sans-serif}.app-shell{width:100%;min-height:100vh;position:relative}.canvas-section{z-index:0;margin:0;position:fixed;inset:0}.canvas-wrap{width:100%;height:100%;position:relative}.game-canvas{width:100%;height:100vh;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:-webkit-optimize-contrast;image-rendering:optimizeQuality;-ms-interpolation-mode:nearest-neighbor;justify-content:center;align-items:center;display:flex}.hero-section{z-index:1;max-width:40rem;padding:clamp(1.5rem,3vw,3rem);position:relative}.hero-section h1{letter-spacing:.04em;color:#f5f0ff;text-shadow:0 2px 24px #000000a6;margin:0 0 .5rem;font-family:Silkscreen,cursive;font-size:clamp(1.75rem,4.5vw,2.75rem);font-weight:700;line-height:1.2}.tagline{letter-spacing:.01em;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#f5f2fff2;text-shadow:0 2px 7px #000000bf;background:#080a127a;border:1px solid #ffffff24;border-radius:.625rem;max-width:min(62ch,100%);margin:.35rem 0 0;padding:.62rem 1rem;font-family:VT323,monospace;font-size:clamp(1.05rem,1.2rem + .4vw,1.45rem);line-height:1.45;transition:opacity .2s,transform .2s,border-color .2s;display:inline-block;box-shadow:0 6px 22px #00000057}body.modal-open .tagline{opacity:0;pointer-events:none;transform:translateY(-4px)}@media (width<=640px){.tagline{-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);border-radius:.55rem;padding:.56rem .88rem}}@media (prefers-reduced-motion:reduce){.tagline{transition:opacity .2s}}.canvas-caption{z-index:1;text-align:center;color:#f5f0ffe0;text-shadow:0 1px 12px #0009;max-width:min(36rem,100vw - 2rem);margin:0;font-family:VT323,monospace;font-size:clamp(.9375rem,1.9vw,1.125rem);line-height:1.3;position:fixed;bottom:clamp(.75rem,2vw,1.25rem);left:50%;transform:translate(-50%)}.about h2,.projects h2,.contact h2{color:#f5f0ff;text-shadow:0 0 5px gold,0 0 10px #ffae00,0 0 20px #ffae0099;margin:0 0 1rem;font-family:"Press Start 2P",cursive;font-size:clamp(.8125rem,2.2vw,1rem);font-weight:400;line-height:1.45}.experience{font-family:Orbitron,sans-serif}.experience h2{color:#f5f0ff;text-shadow:0 0 5px gold,0 0 10px #ffae00,0 0 20px #ffae0073;margin:0 0 1rem;font-size:clamp(1.25rem,3vw,1.5rem);font-weight:700}.skills h2{color:#f5f0ff;text-shadow:0 0 5px gold,0 0 10px #ffae00,0 0 20px #ffae0080;margin:0 0 1rem;font-family:Pixelify Sans,sans-serif;font-size:clamp(1.35rem,3vw,1.6rem);font-weight:700}.modal-section p,.modal-section ul{color:#f5f0ffeb;margin:0 0 .75rem;font-size:clamp(.9375rem,1.8vw,1rem);line-height:1.6}.modal-section ul{padding-left:1.25rem}.modal-section li{margin-bottom:.35rem}.modal-section h3,.modal-section h4{color:#f5f0ff;margin:0 0 .5rem;font-family:Pixelify Sans,sans-serif;font-size:1rem;font-weight:700}.experience h3{font-family:Orbitron,sans-serif}.experience-card{background:#2a1f4580;border:1px solid #f5f0ff1a;border-radius:12px;margin-bottom:1rem;padding:1.25rem}.experience-company{color:#f5f0fff2;margin:0 0 .25rem;font-weight:500}.experience-meta{color:#f5f0ffbf;margin:0 0 .75rem;font-size:.875rem}.skills-grid{flex-direction:column;gap:1rem;display:flex}.skill-group h3{margin-bottom:.5rem}.skill-tags{flex-wrap:wrap;gap:.5rem;display:flex}.skill-tag{color:#f5f0ffeb;background:#f5f0ff1a;border:1px solid #f5f0ff33;border-radius:8px;padding:.35rem .75rem;font-size:.875rem}.contact-links{flex-direction:column;gap:.5rem;display:flex}.contact-link{color:#f5f0ffeb;align-items:center;gap:.5rem;text-decoration:none;display:inline-flex}.contact-text{cursor:default}.contact-link:hover{color:#f5f0ff}.contact-icon{min-width:4.25rem;font-size:.95rem}.projects-list{flex-direction:column;gap:1.25rem;display:flex}.project-card{background:#2a1f4580;border:1px solid #f5f0ff1a;border-radius:12px;padding:1.25rem}.project-card-featured{border-color:#ffd366a6;box-shadow:0 0 0 1px #ffd36640,0 0 14px #ffb93847}.project-header{margin-bottom:.5rem}.project-header h3{margin:0 0 .25rem}.project-tag{color:#f5f0ffbf;font-size:.8125rem}.project-description{margin-bottom:.5rem}.project-tech,.project-features,.project-focus{margin-top:.5rem}.project-tech h4,.project-features h4,.project-focus h4{margin:0 0 .25rem;font-size:.9375rem}.building-modal-backdrop{z-index:20;-webkit-backdrop-filter:none;backdrop-filter:none;background:radial-gradient(circle at 50% 20%,#ffce7224,#0000 40%),radial-gradient(circle at 20% 80%,#5f371c33,#0000 35%),#090710d6;justify-content:center;align-items:center;padding:clamp(1rem,4vw,2rem);display:flex;position:fixed;inset:0}.building-modal{--rpg-frame-dark:#2f1b12;--rpg-frame-mid:#5a3720;--rpg-frame-light:#8d5f34;--rpg-parchment:#e8d7aa;--rpg-parchment-shadow:#d6c08f;--rpg-ink:#2a1a0f;--rpg-ink-soft:#5b3f26;--rpg-gold:#f3cf6b;--rpg-gold-deep:#af7a26;background:linear-gradient(180deg, #0000002e, transparent 18%), linear-gradient(145deg, var(--rpg-frame-light) 0%, var(--rpg-frame-mid) 60%, var(--rpg-frame-dark) 100%);width:100%;max-width:44rem;max-height:min(90vh,50rem);color:var(--rpg-ink);image-rendering:pixelated;border:3px solid #1a0f0a;border-radius:0;flex-direction:column;padding:clamp(.6rem,1.8vw,.9rem);display:flex;position:relative;overflow:hidden;box-shadow:8px 8px #160c08f2,14px 14px #05030a7a,inset 0 0 0 2px #f2c56f59,inset 0 -6px #1c0e0859}.building-modal:before{content:"";pointer-events:none;background:linear-gradient(90deg,#ffe69c14,#0000 10% 90%,#ffe69c14),repeating-linear-gradient(90deg,#0000 0 4px,#00000012 4px 5px);position:absolute;inset:0}.building-modal-content{background:radial-gradient(circle at 20% 12%, #fff2c647, transparent 33%), linear-gradient(180deg, var(--rpg-parchment) 0%, var(--rpg-parchment-shadow) 100%);min-height:0;image-rendering:pixelated;border:3px solid #4a2c15e6;border-radius:0;flex:1;margin:0;padding:clamp(1.1rem,2.6vw,1.6rem);position:relative;overflow:hidden auto;box-shadow:inset 0 0 0 2px #ffe6a38c,inset 0 -10px #6d4b262e}.building-modal-content:after{content:"";pointer-events:none;border-radius:inherit;background:repeating-linear-gradient(0deg,#0000 0 3px,#462d1608 3px 4px);position:absolute;inset:0}.building-modal-content::-webkit-scrollbar{width:12px}.building-modal-content::-webkit-scrollbar-track{background:#5d3b1e33;border:2px solid #462c1673;border-radius:0}.building-modal-content::-webkit-scrollbar-thumb{background:linear-gradient(#7c522e 0%,#4f301c 100%);border:2px solid #27160af2;border-radius:0}.building-modal .modal-section{z-index:1;position:relative}.building-modal .about h2,.building-modal .projects h2,.building-modal .contact h2,.building-modal .skills h2,.building-modal .experience h2{color:var(--rpg-ink);text-shadow:1px 1px #f3cf6bd9,2px 2px #5f371c59;filter:none;font-family:"Press Start 2P",cursive}.building-modal .skills h2{font-family:"Press Start 2P",cursive}.building-modal .experience{font-family:VT323,monospace}.building-modal .modal-section p,.building-modal .modal-section ul{color:var(--rpg-ink-soft)}.building-modal .modal-section h3,.building-modal .modal-section h4{color:var(--rpg-ink);font-family:VT323,monospace;font-size:clamp(1.15rem,2.2vw,1.25rem);line-height:1.35}.building-modal .experience h3{font-family:VT323,monospace}.building-modal .experience-company{color:var(--rpg-ink)}.building-modal .experience-meta{color:#5b3f26cc}.building-modal .experience-card{background:#fff6dc42;border:2px solid #66422194;border-radius:0;box-shadow:inset 0 0 0 1px #ffdf9b66,3px 3px #3e25148c}.building-modal .skill-tag{color:var(--rpg-ink);background:#7b522c33;border:2px solid #53341cad;border-radius:0;box-shadow:inset 0 1px #ffde9440,2px 2px #3e251466}.building-modal .contact-link{color:var(--rpg-ink)}.building-modal .contact-link:hover{color:#1c0f08;text-shadow:0 0 8px #f3cf6b80}.building-modal .project-card{background:#fff6dc3d;border:2px solid #66422194;border-radius:0;box-shadow:inset 0 0 0 1px #ffdf9b66,3px 3px #3e25148c}.building-modal .project-card-featured{border-color:#b67826d9;box-shadow:inset 0 0 0 1px #ffdf9b73,3px 3px #3e25148c,0 0 0 2px #f3cf6b59}.building-modal .project-tag{color:#5b3f26cc}.building-modal-title{color:var(--rpg-ink);text-shadow:1px 1px #f3cf6bd9,2px 2px #5f371c4d;margin:0 0 .75rem;font-family:"Press Start 2P",cursive;font-size:clamp(.85rem,2.2vw,1rem);font-weight:400;line-height:1.35}.building-modal-body{color:var(--rpg-ink-soft);margin:0 0 1.25rem;font-size:1rem;line-height:1.55}.building-modal-close{font:inherit;letter-spacing:.07em;cursor:pointer;color:#2a190c;background:linear-gradient(#f4d06d 0%,#c58a35 100%);border:3px solid #2e1a0f;border-radius:0;align-self:center;margin:.8rem 0 .15rem;padding:.7rem 1.5rem;font-family:"Press Start 2P",cursive;font-size:clamp(.52rem,1.5vw,.62rem);font-weight:400;line-height:1.2;transition:transform 80ms,box-shadow 80ms,filter .12s;box-shadow:0 5px #56331c,inset 0 1px #fff8d4b3}.building-modal-close:hover{filter:brightness(1.05)}.building-modal-close:active{transform:translateY(4px);box-shadow:0 1px #56331c,inset 0 1px #fff8d48c}.building-modal-close:focus-visible{outline:2px solid var(--rpg-gold);outline-offset:3px}.building-modal-hint{text-align:center;color:#482d17c7;margin:0 0 .25rem;font-family:VT323,monospace;font-size:1.05rem;line-height:1.3}@media (width<=640px){.building-modal{border-radius:0;padding:.6rem}.building-modal-content{border-radius:0;padding:1rem .9rem}.building-modal-close{width:100%;max-width:13rem}}.player-dialog{z-index:12;pointer-events:none;color:#fff;text-align:center;text-shadow:0 1px 8px #0000008c;background:#000000c7;border:1px solid #ffffff80;border-radius:8px;max-width:min(22rem,100vw - 1rem);padding:.45rem .7rem;font-family:VT323,monospace;font-size:clamp(1rem,1.8vw,1.25rem);line-height:1.1;position:fixed;transform:translate(-50%,-100%);box-shadow:0 4px 14px #00000059}.intro-message{--bubble-bg:#fff;--bubble-border:#f5f0ff40;isolation:isolate;z-index:11;pointer-events:none;background:var(--bubble-bg);border:1px solid var(--bubble-border);color:#000;text-shadow:0 1px 8px #00000080;opacity:.9;border-radius:10px;width:340px;max-width:min(26rem,100vw - 1rem);padding:.75rem 1rem;font-family:VT323,monospace;font-size:clamp(1rem,1.8vw,1.2rem);line-height:1.3;transition:opacity .3s ease-out;position:fixed;transform:translate(-50%,-100%);box-shadow:0 2px 12px #0000004d}.intro-message:after{content:"";border-left:11px solid #0000;border-right:11px solid #0000;border-top:14px solid var(--bubble-bg);z-index:1;width:0;height:0;position:absolute;bottom:-14px;right:40px}.intro-message:before{content:"";border-left:12px solid #0000;border-right:12px solid #0000;border-top:16px solid var(--bubble-border);z-index:0;width:0;height:0;position:absolute;bottom:-16px;right:39px}.intro-message p{margin:0}.typing-cursor{opacity:.35;margin-left:.15em;display:inline-block}.typing-cursor.is-typing{animation:.75s step-end infinite intro-cursor-blink}@keyframes intro-cursor-blink{50%{opacity:0}}.instruction-overlay{z-index:12;pointer-events:none;flex-direction:column;align-items:center;gap:.35rem;display:flex;position:fixed;top:0;left:0;transform:translate(-50%,-100%)}.instruction-title{letter-spacing:.06em;text-transform:uppercase;color:#fffffffa;text-shadow:0 2px 12px #000000a6;margin:0;font-family:Pixelify Sans,sans-serif;font-size:clamp(1rem,2vw,1.2rem)}.instruction-label{color:#ffffffe0;text-shadow:0 1px 10px #000000b3;margin:0;font-family:VT323,monospace;font-size:clamp(.95rem,1.8vw,1.1rem)}.instruction-keys{background:#00000047;border:1px solid #ffffff29;border-radius:.8rem;align-items:end;gap:3rem;padding:.5rem .85rem;display:flex;box-shadow:0 6px 22px #00000059}.instruction-group{flex-direction:column;align-items:center;gap:.35rem;display:flex}.instruction-arrows{grid-template-rows:repeat(2,2.2rem);grid-template-columns:repeat(3,2.2rem);gap:.35rem;display:grid}.key{-webkit-backdrop-filter:blur(2px);color:#fffffff2;background:#ffffff1f;border:1px solid #ffffff73;border-radius:.5rem;justify-content:center;align-items:center;font-family:Pixelify Sans,sans-serif;font-size:1rem;line-height:1;display:inline-flex;box-shadow:0 4px 16px #00000059}.key-up{grid-area:1/2}.key-left{grid-area:2/1}.key-down{grid-area:2/2}.key-right{grid-area:2/3}.key-up,.key-left,.key-down,.key-right{width:2.2rem;height:2.2rem}.key-space{letter-spacing:.08em;min-width:clamp(7rem,14vw,9.5rem);height:2.2rem;padding:0 1rem;font-size:.82rem}.key-inline-row{align-items:center;gap:.5rem;display:flex}.key-small{letter-spacing:.05em;min-width:3.6rem;height:2.2rem;padding:0 .65rem;font-size:.74rem}@media (width<=640px){.instruction-keys{gap:.65rem;padding:.4rem .55rem}.instruction-arrows{grid-template-rows:repeat(2,1.9rem);grid-template-columns:repeat(3,1.9rem)}.key-up,.key-left,.key-down,.key-right{width:1.9rem;height:1.9rem}.key-space{min-width:6.3rem;height:1.9rem}.key-small{min-width:3.1rem;height:1.9rem;padding:0 .45rem;font-size:.68rem}}.text-caption{color:#ffffffe0;text-shadow:0 1px 10px #000000b3;text-align:center;margin:0;font-family:VT323,monospace;font-size:clamp(.95rem,1.8vw,1.1rem);line-height:1.35}