:root{--text-colour: rgb(252, 237, 242);--shadow-colour: rgb(160, 122, 135)}@font-face{font-family:Arial}*{margin:0;padding:0;box-sizing:border-box}body{min-height:100vh;background:#e1e1e1f2;height:100vh;display:flex;justify-content:center;align-items:center;flex-direction:column;position:relative}body:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:repeating-linear-gradient(0deg,rgba(0,0,0,.1),rgba(0,0,0,.1) 1px,transparent 1px,transparent 20px),repeating-linear-gradient(90deg,rgba(0,0,0,.1),rgba(0,0,0,.1) 1px,transparent 1px,transparent 20px);pointer-events:none;z-index:-1}.main-container{position:fixed;top:50px;left:200px;right:100px;bottom:100px;background:silver;border:2px solid #000;box-shadow:2px 2px #fff,4px 4px #000;border-radius:0;overflow:hidden;display:flex;flex-direction:column;will-change:transform;backface-visibility:hidden;transform:translateZ(0)}body.splash-active{overflow:hidden}body.splash-active .main-container{pointer-events:none}.main-container.splash-drag-in{transform-origin:top left}@keyframes dragWindowIn{0%{transform:translate3d(-90vw,-48vh,0)}to{transform:translateZ(0)}}canvas.webgl{width:100%;height:calc(100% - 20px)}.github-window,.cv-window,.playground-window{position:fixed;width:200px;height:125px;background:silver;border:2px solid #000;box-shadow:2px 2px #fff,4px 4px #000;font-family:orbitron,Arial,sans-serif;animation:float 3s ease-in-out infinite;opacity:0;transform:scale(.8);transition:opacity .5s ease-out,transform .5s ease-out}.github-window{top:200px;left:75px}.cv-window{bottom:125px;right:200px}.playground-window{top:25px;right:350px}.github-window.visible,.cv-window.visible,.playground-window.visible{opacity:1;transform:scale(1)}.window-header{background:linear-gradient(90deg,navy,#1084d0);color:#fff;padding:4px;font-size:12px;font-family:orbitron,Arial,sans-serif;position:relative}.window-content{height:80%;padding:10px;font-size:10px;color:#000;background:linear-gradient(135deg,#e0e0e0,#f0f0f0);border-top:1px solid #000;position:relative;display:flex;justify-content:center;align-items:center;min-height:50px}.btn{display:inline-block;font-family:orbitron,Arial,sans-serif;font-size:16px;color:#000;background:linear-gradient(45deg,#c8ff00,#0ff);padding:5px 10px;text-decoration:none;border:1px solid #000;box-shadow:1px 1px #fff,2px 2px #000;transition:transform .2s ease,filter .2s ease}.btn:hover{transform:scale(1.05);filter:brightness(1.2);animation:glitch .3s infinite}@keyframes glitch{0%{transform:translate(0)}20%{transform:translate(-.75px,.75px)}40%{transform:translate(-.75px,-.75px)}60%{transform:translate(.75px,.75px)}80%{transform:translate(.75px,-.75px)}to{transform:translate(0)}}.window-close{position:absolute;top:4px;right:4px;font-family:Arial,sans-serif;font-weight:700;font-size:12px;color:#fff;background:red;width:14px;height:14px;text-align:center;line-height:14px;border:1px solid #000;box-shadow:1px 1px #fff,2px 2px #000;cursor:default}@keyframes float{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-10px) scale(1)}}@media screen and (max-width: 768px){body{overflow-x:hidden}.main-container{position:fixed;top:20px;left:10px;right:10px;bottom:20px;box-shadow:1px 1px #fff,2px 2px #000}@keyframes dragWindowIn{0%{transform:translate3d(-115vw,-58vh,0)}to{transform:translateZ(0)}}.github-window,.cv-window,.playground-window{width:150px;height:110px;box-shadow:1px 1px #fff,2px 2px #000}.github-window{top:100px;left:15px}.cv-window{bottom:80px;right:15px}.playground-window{top:15px;right:15px}.window-header{font-size:10px;padding:3px}.window-content{padding:8px;font-size:9px}.btn{font-size:12px;padding:4px 8px}.window-close{font-size:10px;width:12px;height:12px;line-height:12px;top:3px;right:3px}}@media screen and (max-width: 480px){.main-container{top:10px;left:5px;right:5px;bottom:10px}.github-window,.cv-window,.playground-window{width:120px;height:100px}.github-window{top:80px;left:10px}.cv-window{bottom:60px;right:10px}.playground-window{top:10px;right:10px}.window-header{font-size:9px;padding:2px}.window-content{padding:6px;font-size:8px}.btn{font-size:10px;padding:3px 6px}}@media screen and (max-width: 768px) and (orientation: landscape){.main-container{top:10px;bottom:10px}.github-window{top:50px;left:10px}.cv-window{bottom:50px;right:10px}.playground-window{top:10px;right:calc(50% - 60px)}}@media screen and (min-width: 769px) and (max-width: 1024px){.main-container{top:30px;left:50px;right:50px;bottom:50px}.github-window{top:120px;left:40px}.cv-window{bottom:100px;right:100px}.playground-window{top:20px;right:150px}}.splash-screen{position:fixed;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,#c0c0c04d,#e0e0e02e);z-index:9999;display:flex;justify-content:center;align-items:center;flex-direction:column;opacity:1;transition:opacity .55s ease-out;pointer-events:all}.splash-screen.fade-out{opacity:0;pointer-events:none}.splash-screen.window-intro{justify-content:flex-start;align-items:flex-start}.splash-drag-cursor{position:fixed;width:28px;height:38px;left:0;top:0;z-index:10001;pointer-events:none;transform-origin:4px 4px;will-change:transform,opacity;backface-visibility:hidden;transform:translateZ(0)}.splash-drag-cursor:before,.splash-drag-cursor .cursor-fill{content:"";position:absolute;top:0;right:0;bottom:0;left:0;clip-path:polygon(0 0,0 100%,32% 74%,52% 100%,68% 93%,48% 67%,100% 67%)}.splash-drag-cursor:before{background:#000}.splash-drag-cursor .cursor-fill{top:2px;right:2px;bottom:2px;left:2px;clip-path:polygon(0 0,0 100%,32% 74%,52% 100%,68% 93%,48% 67%,100% 67%);background:#fff}.splash-drag-cursor.fade-out{opacity:0;transition:opacity .2s linear}.splash-screen:before{display:none}.splash-content{position:relative;z-index:2;text-align:center;display:flex;flex-direction:column;gap:40px;align-items:center}.window-intro .splash-content{position:fixed;top:22px;left:22px;gap:10px;padding:10px 12px;background:silver;border:2px solid #000;box-shadow:2px 2px #fff,4px 4px #000}.window-intro .geometric-container,.window-intro .splash-title{display:none}.window-intro .splash-subtitle{margin:0;font-size:11px;letter-spacing:1px;opacity:.9}.splash-title{display:flex;justify-content:center;align-items:center;color:#000;text-transform:uppercase;letter-spacing:2px;text-shadow:2px 2px 0 #1084d0,4px 4px 0 #00ffff}.splash-subtitle{font-family:orbitron,Arial,sans-serif;font-size:14px;color:#000;letter-spacing:2px;text-transform:uppercase;opacity:.7}.geometric-container{position:relative;width:200px;height:200px;animation:rotate 8s linear infinite}.geometric-shape{position:absolute;background:transparent;border:2px solid}.circle-1{top:50%;left:50%;width:150px;height:150px;border-radius:50%;border-color:#1084d0;transform:translate(-50%,-50%);animation:pulse 2s ease-in-out infinite}.circle-2{top:50%;left:50%;width:100px;height:100px;border-radius:50%;border-color:#0ff;transform:translate(-50%,-50%);animation:pulse 2.5s ease-in-out infinite reverse}.square-1{top:25px;left:50%;width:60px;height:60px;border-color:#c8ff00;transform:translate(-50%) rotate(45deg);animation:bounce 1.5s ease-in-out infinite}.square-2{bottom:25px;right:25px;width:40px;height:40px;border-color:#1084d0;animation:slideRight 2s ease-in-out infinite}.splash-name-svg{width:520px;max-width:85vw;height:auto;display:block}.splash-name-svg svg{width:100%;height:auto;display:block;filter:drop-shadow(2px 2px 0 #1084d0) drop-shadow(4px 4px 0 #00ffff)}@keyframes slideDown{0%{opacity:0;transform:translateY(-40px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pulse{0%,to{transform:translate(-50%,-50%) scale(1);opacity:1}50%{transform:translate(-50%,-50%) scale(.8);opacity:.6}}@keyframes bounce{0%,to{transform:translate(-50%) rotate(45deg) translateY(0)}50%{transform:translate(-50%) rotate(45deg) translateY(-20px)}}@keyframes slideRight{0%,to{transform:translate(0)}50%{transform:translate(20px)}}@keyframes load{0%{width:0%}to{width:100%}}@keyframes dragCursorTrack{0%{opacity:1;transform:translate3d(calc(360px - 90vw),calc(56px - 48vh),0)}to{opacity:1;transform:translate3d(360px,56px,0)}}@keyframes dragCursorExit{0%{opacity:1;transform:translate3d(360px,56px,0)}to{opacity:0;transform:translate3d(-56px,56px,0)}}@media screen and (max-width: 768px){.splash-content{gap:30px;padding:20px}.geometric-container{width:150px;height:150px}.circle-1{width:120px;height:120px}.circle-2{width:80px;height:80px}.square-1{width:50px;height:50px}.square-2{width:35px;height:35px}.splash-name-svg{width:90vw;max-width:400px}.splash-subtitle{font-size:12px}@keyframes dragCursorTrack{0%{opacity:1;transform:translate3d(calc(80px - 115vw),calc(26px - 58vh),0)}to{opacity:1;transform:translate3d(80px,26px,0)}}@keyframes dragCursorExit{0%{opacity:1;transform:translate3d(80px,26px,0)}to{opacity:0;transform:translate3d(-52px,26px,0)}}}@media screen and (max-width: 480px){.splash-content{gap:20px;padding:15px}.geometric-container{width:120px;height:120px}.circle-1{width:100px;height:100px}.circle-2{width:60px;height:60px}.square-1{width:40px;height:40px}.square-2{width:30px;height:30px}.splash-name-svg{width:95vw;max-width:300px}.splash-subtitle{font-size:10px}}
