*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden;background:#020408}canvas.webgl{position:fixed;top:0;left:0;outline:none}#intro{position:fixed;top:0;right:0;bottom:0;left:0;background:#020408;display:flex;align-items:center;justify-content:center;z-index:100;transition:opacity 1s ease}#intro.hidden{opacity:0;pointer-events:none}#intro-content{width:480px;font-family:JetBrains Mono,Courier New,monospace;color:#00f0ff}#intro-terminal{font-size:13px;line-height:1.8;margin-bottom:24px;min-height:160px;white-space:pre}#intro-bar{width:100%;height:2px;background:#0a2030;margin-bottom:24px}#intro-bar-fill{height:100%;width:0%;background:#00f0ff;box-shadow:0 0 8px #00f0ff;transition:width .1s linear}#intro-btn{background:transparent;border:1px solid #00f0ff;color:#00f0ff;font-family:JetBrains Mono,Courier New,monospace;font-size:14px;padding:12px 32px;cursor:pointer;letter-spacing:2px;transition:all .3s}#intro-btn:hover{background:#00f0ff22;box-shadow:0 0 20px #00f0ff44}#hud{position:fixed;top:0;right:0;bottom:0;left:0;font-family:JetBrains Mono,Courier New,monospace;pointer-events:none;opacity:0;transition:opacity 1s ease;z-index:10}#hud.visible{opacity:1}#hud-telemetry{position:absolute;top:24px;left:24px;font-size:11px;color:#00f0ff55;line-height:2}.telem-row{display:flex;gap:10px;align-items:center}.telem-label{color:#00f0ff33;min-width:32px}#telem-boost-track{width:80px;height:4px;background:#00f0ff11;border:1px solid #00f0ff22;position:relative;align-self:center}#telem-boost-fill{height:100%;width:0%;background:#00f0ff;box-shadow:0 0 6px #00f0ff;transition:width .05s linear,background .15s ease,box-shadow .15s ease}#telem-boost-fill.boosting{background:#fff;box-shadow:0 0 12px #00f0ff,0 0 4px #fff}#hud-center{position:absolute;bottom:32px;left:50%;transform:translate(-50%);text-align:center}#hud-name{font-size:20px;color:#00f0ff;letter-spacing:6px;text-shadow:0 0 10px #00f0ff88}#hud-role{font-size:11px;color:#fff8;letter-spacing:3px;margin-top:6px}#hud-controls{font-size:10px;color:#fff3;letter-spacing:2px;margin-top:12px}#hud-nav{display:flex;gap:16px;justify-content:center;margin-top:16px}.hud-nav-btn{background:transparent;border:1px solid #00f0ff33;color:#00f0ff88;font-family:JetBrains Mono,Courier New,monospace;font-size:10px;padding:7px 18px;cursor:pointer;letter-spacing:2px;transition:all .2s;pointer-events:auto}.hud-nav-btn:hover,.hud-nav-btn.active{border-color:#00f0ff;color:#00f0ff;box-shadow:0 0 12px #00f0ff22}a.hud-nav-btn{text-decoration:none;display:inline-block}#btn-fullscreen{position:absolute;top:20px;right:20px;background:transparent;border:1px solid #ffffff22;color:#fff4;font-size:18px;width:36px;height:36px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;pointer-events:auto;line-height:1}#btn-fullscreen:hover{border-color:#00f0ff55;color:#00f0ff}.portfolio-panel{position:fixed;top:50%;left:50%;transform:translate(-50%,-46%);z-index:50;width:min(600px,90vw);max-height:80vh;overflow-y:auto;pointer-events:none;opacity:0;transition:opacity .3s ease,transform .3s ease}.portfolio-panel.visible{pointer-events:auto;opacity:1;transform:translate(-50%,-50%)}.panel-inner{position:relative;background:#020408f5;border:1px solid #00f0ff33;padding:36px 32px 32px;font-family:JetBrains Mono,Courier New,monospace}.panel-inner h2{color:#00f0ff;letter-spacing:6px;font-size:18px;margin-bottom:8px}.panel-subtitle{color:#fff5;font-size:11px;letter-spacing:3px;margin-bottom:28px}.panel-close{position:absolute;top:16px;right:16px;background:transparent;border:1px solid #ffffff1a;color:#fff5;font-family:JetBrains Mono,Courier New,monospace;font-size:10px;padding:6px 12px;cursor:pointer;letter-spacing:1px;transition:all .2s}.panel-close:hover{border-color:#00f0ff44;color:#00f0ff}.panel-body{color:#fffa;font-size:12px;line-height:1.9}.panel-body>p{margin-bottom:24px}.panel-skills{display:flex;flex-direction:column;gap:12px}.skill-group{display:flex;gap:16px;align-items:baseline}.skill-label{color:#00f0ff99;font-size:10px;letter-spacing:2px;min-width:80px;flex-shrink:0}.project-item{border-left:2px solid #00f0ff1a;padding-left:16px;margin-bottom:24px}.project-item:last-child{margin-bottom:0}.project-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;gap:12px}.project-name{color:#00f0ff;font-size:13px;letter-spacing:2px}.project-tag{color:#fff3;font-size:10px;letter-spacing:1px;flex-shrink:0}.contact-links{display:flex;flex-direction:column;gap:10px;margin-top:24px}.contact-item{display:flex;align-items:center;gap:16px;text-decoration:none;color:#fffa;padding:12px 16px;border:1px solid #ffffff0d;transition:all .2s;font-size:12px}.contact-item:hover{border-color:#00f0ff44;color:#00f0ff;background:#00f0ff08}.contact-label{color:#00f0ff99;font-size:10px;letter-spacing:2px;min-width:70px}.project-dialog{position:fixed;bottom:120px;right:28px;width:min(340px,90vw);background:#020408eb;border:1px solid #00f0ff;box-shadow:0 0 24px #00f0ff33,inset 0 0 40px #00f0ff06;font-family:JetBrains Mono,Courier New,monospace;z-index:60;pointer-events:auto;padding:20px 20px 18px;transition:opacity .25s ease,transform .25s ease;opacity:1;transform:translate(0)}.project-dialog.hidden{opacity:0;pointer-events:none;transform:translate(20px)}.project-dialog-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.project-dialog-tag{font-size:9px;color:#00f0ff88;letter-spacing:2px}#project-close{background:transparent;border:none;color:#fff5;font-size:13px;cursor:pointer;padding:0 2px;transition:color .2s}#project-close:hover{color:#00f0ff}#project-name{color:#00f0ff;font-size:13px;letter-spacing:3px;margin-bottom:10px;line-height:1.4}#project-desc{color:#fffa;font-size:11px;line-height:1.8;margin-bottom:14px}#project-stack{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}.stack-chip{font-size:9px;letter-spacing:1px;color:#00f0ffcc;border:1px solid #00f0ff44;padding:3px 8px}.project-dialog-links{display:flex;gap:12px}.project-dialog-links a{font-size:10px;letter-spacing:2px;color:#00f0ff99;text-decoration:none;border:1px solid #00f0ff33;padding:5px 12px;transition:all .2s}.project-dialog-links a:hover{color:#00f0ff;border-color:#00f0ff;background:#00f0ff11}
