@import"https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap";:root{--cyan: #00e0ff;--yellow: #ffd400;--lime: #3cff6b;--pink: #ff00b7;--bg: #000;--panel: #111;--muted: #555;--nav-height: 90px}html,body{height:100%;scroll-behavior:smooth;padding-top:75px}body{margin:0;background:var(--bg);color:#fff;font-family:"Press Start 2P",monospace;line-height:1.5}.portfolio-container{min-height:100vh}.container{width:min(1100px,92vw);margin-inline:auto;margin-top:0}.navbar{position:fixed;top:0;z-index:1000;background:var(--bg);border-bottom:3px solid var(--cyan);width:100%;height:var(--nav-height);display:flex;align-items:center;justify-content:space-between}.navbar-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:nowrap}.logo{color:var(--cyan);font-size:1.5rem;letter-spacing:.5px;font-family:"Press Start 2P";text-decoration:none;margin:0}.nav-menu{list-style:none;display:flex;flex-wrap:nowrap;gap:clamp(.4rem,2vw,1rem);padding:0;margin:0}.nav-item a{color:var(--cyan);text-decoration:none;font-family:"Press Start 2P";font-size:.8rem;letter-spacing:.5px;border:1.5px solid var(--cyan);padding:.7rem 1.1rem;display:inline-block;transition:background .2s,color .2s,transform .05s}.nav-item a:hover{background:var(--cyan);color:#000}.nav-item a:active{transform:translateY(1px)}.hero{display:grid;grid-template-columns:1fr clamp(280px,36vw,420px);gap:clamp(1.25rem,4vw,4rem);align-items:start;margin-bottom:3rem;scroll-margin-top:120px;padding-top:2rem}.intro{max-width:65ch}.status{display:inline-block;color:var(--lime);border:2px solid var(--lime);font-size:.6rem;font-family:"Press Start 2P";padding:.25rem .5rem;margin-bottom:1.2rem}.intro h2{font-size:clamp(1rem,4vw,1.8rem);margin:0 0 .6rem}.highlight{color:var(--cyan);font-family:"Press Start 2P";font-size:clamp(1.1rem,4.8vw,1.8rem);display:inline-block}.hero h3{color:var(--yellow);font-size:clamp(1rem,3vw,1.2rem);margin:.6rem 0 1.8rem;font-family:"Press Start 2P"}.message-box{border:2px solid var(--muted);padding:1rem;margin:1rem 0 1.25rem;font-size:clamp(.7rem,2.2vw,.9rem);font-family:"monospace"}.typed-text{white-space:pre-wrap;margin:0}.message-box-cursor{color:var(--cyan);font-size:1.2rem;animation:blink 1s infinite}@keyframes blink{0%,50%{opacity:1}51%,to{opacity:0}}.buttons{display:flex;flex-wrap:wrap;gap:.8rem;font-family:"Press Start 2P"}.btn{text-decoration:none;font-size:.72rem;padding:.8rem 1.2rem;display:inline-flex;align-items:center;gap:.5rem;border:none;cursor:pointer;transition:background .2s,color .2s,transform .05s;font-family:"Press Start 2P"}.btn-primary{background-color:var(--cyan);color:var(--bg);letter-spacing:.5px;padding:.7rem 1.1rem;border:3px solid transparent}.btn-primary:hover{background-color:#000;color:var(--cyan);border-color:var(--cyan)}.btn-secondary{color:var(--pink);border:2px solid var(--pink);background:transparent}.btn-secondary:hover{background:var(--pink);color:#000;font-weight:700}.stats-row{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:1rem;font-family:"Press Start 2P"}.card-primary{border:2px solid var(--yellow);padding:.7rem .8rem;font-size:.72rem}.card-secondary{border:2px solid var(--lime);padding:.7rem .8rem;font-size:.72rem}.terminal{position:relative;background:var(--panel);border:3px solid #fff;padding:10px;width:100%;max-width:clamp(320px,36vw,420px);justify-self:end}.badge-new{position:absolute;top:-30px;right:-20px;background:var(--yellow);color:#000;font-size:.75rem;font-family:"Press Start 2P";border:2px solid #000;padding:.5rem;box-shadow:2px 2px #000,4px 4px #ffffff26 inset;animation:bounce 1.5s ease-in-out infinite alternate}.terminal-header{display:flex;align-items:center;gap:4px;margin-bottom:10px;padding-bottom:10px;border-bottom:2px solid var(--cyan)}.dot{width:12px;height:12px;display:inline-block}.red{background:red}.yellow{background:var(--yellow)}.green{background:var(--lime)}.terminal-title{margin-left:auto;font-size:.6rem;color:var(--cyan);font-family:"Press Start 2P"}.terminal-body{border:2px solid var(--muted);padding:2rem;align-items:center;text-align:center}.player-name{text-align:center;font-size:1rem;font-family:"Press Start 2P";margin-bottom:0rem}.player-about-name{text-align:center;font-size:.8rem;font-family:"Press Start 2P";margin-bottom:1rem}.stat-row{display:flex;align-items:center;gap:8px;margin:8px 0;font-family:"Press Start 2P",monospace;font-size:10px}.stat-label{width:40px;color:#00e0ff;margin:0rem}.bar{flex:1;background:#333;height:16px;position:relative;border:1px solid #555}.bar span{display:block;height:100%}.hp{background:#0f0}.mp{background:#0ff}.xp{background:gold}.stat-value{width:60px;text-align:right}.class{padding:.7rem;font-size:.72rem;margin-top:.6rem;font-family:"Press Start 2P";text-align:center}.status-ready{font-size:.82rem;font-family:"Press Start 2P";text-align:center;padding-top:0;color:var(--lime)}.about{border:3px solid var(--yellow);background:#0a0a0a;scroll-margin-top:120px;padding:2rem 0}.dashboard-container{display:grid;grid-template-columns:320px 1fr;gap:2rem;max-width:1200px;margin:0 auto;padding:2rem}.player-profile-panel,.stats-panel{display:flex;flex-direction:column;align-items:center}.stats-panel{display:contents}.panel-header{padding:.2rem 1.5rem;font-size:small;text-align:justify;font-family:"Press Start 2P"}.player-profile-header h3{text-align:center;margin:0;color:var(--pink);font-size:1.1rem;font-family:"Press Start 2P";font-weight:700;letter-spacing:1px;padding-top:50px}.player-profile-panel{padding:2rem}.player-avatar{text-align:center;margin:1.5rem}.avatar-frame{display:inline-block;padding:2px;background:var(--yellow)}.avatar-frame img{width:120px;height:120px;display:block}.player-info{text-align:center}.personal-message{background:#dae4df0d;border:3px solid var(--lime)}.message-header{background:#00ff7f1a;padding:.8rem 1.2rem;display:flex;align-items:center;gap:.5rem;border-bottom:2px solid #00ff7f}.message-header span{color:#00ff7f;font-weight:700;font-size:.9rem}.message-content{padding:1.5rem;font-family:Courier New,Courier,"monospace"}.message-content p{color:#e0e0e0;line-height:1.6;margin-bottom:1rem;font-size:.95rem}.tab-btn{flex:1;background:transparent;border:none;padding:1rem;color:#888;font-size:.9rem;font-weight:700;cursor:pointer;transition:all .3s ease;border-right:1px solid #333}.tab-btn:last-child{border-right:none}.tab-btn.active{background:#0ff;color:#000}.tab-btn:hover:not(.active){background:#ffffff0d;color:#fff}.tab-content{display:none}.tab-content.active{display:block}.projects-section{padding:5rem 0;scroll-margin-top:20px}.section-title{font-family:"Press Start 2P";font-size:1.4rem;color:var(--cyan);text-align:center;margin-bottom:2rem;border-bottom:2px solid var(--cyan);padding-bottom:.5rem}.projects-scroll{display:flex;gap:2rem;overflow-x:auto;scroll-behavior:smooth;padding:1rem 2rem}.projects-scroll::-webkit-scrollbar{height:8px}.projects-scroll::-webkit-scrollbar-track{background:#111}.projects-scroll::-webkit-scrollbar-thumb{background:var(--lime);border-radius:4px}.projects-scroll::-webkit-scrollbar-thumb:hover{background:#00ad56}.project-card{flex:0 0 330px;background:var(--panel);border:2px solid #333;padding:1.5rem;transition:all .3s ease;position:relative;scroll-snap-align:start}.project-card:hover{border-color:var(--pink)}.project-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.project-status-dot{width:12px;height:12px;border-radius:50%;animation:pulse 2s infinite}.project-status{font-size:.7rem;color:var(--muted)}.project-title{font-size:1rem;margin-bottom:.5rem;color:#fff}.project-tech{color:var(--cyan);font-size:.8rem;margin-bottom:1rem;font-family:Courier New,Courier,"monospace"}.project-description{color:#ccc;font-size:1rem;line-height:1.4;margin-bottom:1.5rem;font-family:Courier New,Courier,"monospace"}.project-link{display:flex;align-items:center;gap:.5rem;background:none;border:none;color:var(--cyan);font-size:.7rem;cursor:pointer;transition:color .3s ease}.project-link:hover{color:#fff}.skills-section{padding-bottom:1.5rem;border:2px solid var(--pink);background:#0a0a0a;scroll-margin-top:120px}.skills-section .section-title{color:var(--pink);border-bottom-color:var(--pink)}.skills-intro{text-align:center;margin-bottom:2rem}.skills-intro p{color:var(--cyan);font-size:1.1rem;font-family:"Press Start 2P"}.skills-grid{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;margin-top:2rem}.skill-tag{background:#1a1a1a;border:2px solid var(--cyan);padding:.8rem 1.2rem;font-size:.8rem;font-family:"Press Start 2P";color:#fff;transition:all .3s ease;cursor:pointer}.skill-tag:hover{background:var(--cyan);color:#000;transform:translateY(-2px);box-shadow:0 5px 15px #00e0ff4d}.contact-section{padding:5rem 0;scroll-margin-top:40px}.contact-section .section-title{color:var(--yellow);border-bottom-color:var(--yellow)}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;margin-top:3rem}.contact-info{display:flex;flex-direction:column;gap:2rem}.contact-heading{font-size:1.2rem;color:var(--cyan);margin-bottom:1rem}.contact-description{color:#ccc;line-height:1.6;font-size:.9rem}.contact-buttons{display:flex;gap:1.3rem}.contact-buttons .icon-btn{display:inline-flex;align-items:center;justify-content:center;width:50px;height:50px;background:var(--panel);color:var(--yellow);border:2px solid var(--yellow);transition:all .3s ease;text-decoration:none;cursor:pointer}.contact-buttons .icon-btn:hover{background:var(--yellow);color:#000;transform:scale(1.1)}.contact-buttons .icon-btn svg{pointer-events:none}.btn-chat{background:transparent;color:var(--lime);border:2px solid var(--lime)}.btn-chat:hover{background:var(--lime);color:#000}.contact-form{background:#1a1a1a;border:2px solid var(--cyan);padding:0;display:flex;flex-direction:column}.form-header{background:var(--cyan);color:#000;padding:1rem;border-bottom:2px solid var(--cyan)}.form-header h4{font-family:"Press Start 2P";font-size:1rem;margin:0;text-align:center}.contact-form-container{padding:2rem;flex-grow:1}.form-group{margin-bottom:1.5rem}.form-group label{display:block;color:var(--cyan);font-size:.8rem;margin-bottom:.5rem;font-family:"Press Start 2P"}.form-group input,.form-group textarea{width:100%;background:#0a0a0a;border:2px solid #333;color:#fff;padding:.8rem;font-family:Courier New,monospace;font-size:.9rem;transition:border-color .3s ease}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:var(--cyan);box-shadow:0 0 10px #00e0ff33}.form-group textarea{resize:vertical;min-height:100px}.contact-form .btn{width:100%;justify-content:center;margin-bottom:1rem}.footer{border-top:2px solid var(--cyan);padding:2rem 0;text-align:center}.footer p{color:#888;font-size:.7rem;margin:0}@media (max-width: 980px){.hero{grid-template-columns:1fr;align-items:start}.terminal{justify-self:start;max-width:520px}.dashboard-container{grid-template-columns:1fr;grid-template-rows:auto auto auto;height:auto}.contact-grid{grid-template-columns:1fr;gap:2rem}.skills-grid{justify-content:center}}@media (max-width: 680px){.nav-menu,.buttons{justify-content:center}.intro{text-align:center}.stats-row{justify-content:center}.terminal{margin-inline:auto}.skills-grid{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.skill-tag{font-size:.7rem;padding:.6rem 1rem}}@media (max-width: 460px){.nav-item a{padding:.5rem .8rem;font-size:.7rem}.badge-new{top:-10px;right:-10px}.tab-btn{border-right:none;border-bottom:1px solid #333}.tab-btn:last-child{border-bottom:none}body{padding-top:120px}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.glitch-effect:hover{animation:glitch .3s}::-webkit-scrollbar-thumb{background:var(--cyan)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:"Press Start 2P",monospace;background:#000;color:#fff;line-height:1.5}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#111}::-webkit-scrollbar-thumb{background:#00e0ff;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#00b8cc}@keyframes bounce{0%{transform:translateY(-2px) rotate(-3deg)}to{transform:translateY(4px) rotate(3deg)}}@keyframes glitch{0%{transform:translate(0)}20%{transform:translate(-2px,2px)}40%{transform:translate(-2px,-2px)}60%{transform:translate(2px,2px)}80%{transform:translate(2px,-2px)}to{transform:translate(0)}}.glitch:hover{animation:glitch .3s}.terminal-effect{background:linear-gradient(to bottom,transparent 50%,rgba(0,224,255,.03) 50%);background-size:100% 2px}@layer utilities{.font-pixel{font-family:"Press Start 2P",monospace}.text-shadow-glow{text-shadow:0 0 10px currentColor}.border-glow{box-shadow:0 0 10px currentColor}}
