:root{--bg:#0f1117;--bg-card:#161b27;--bg-nav:#0c0f18ee;--border:#2a2f45;--text:#d4d8e8;--text-muted:#6b7396;--accent:#7c6af7;--accent-2:#3fefc8;--accent-3:#f73f7c;--youtube:red;--itch:#fa5c5c;--github-btn:#2a2f45;--tag-godot:#4a90d9;--tag-raylib:#e8a838;--tag-unity:#aaa;--tag-unreal:#0f80e0;--tag-other:#6b7396;--radius:8px;--radius-lg:14px;--shadow:0 4px 24px #0006;--font-mono:"Courier New", Courier, monospace}@keyframes grain{0%,to{transform:translate(0)}10%{transform:translate(-2%,-3%)}20%{transform:translate(3%,1%)}30%{transform:translate(-1%,2%)}40%{transform:translate(2%,-2%)}50%{transform:translate(-3%,3%)}60%{transform:translate(1%,-1%)}70%{transform:translate(-2%,2%)}80%{transform:translate(3%,-3%)}90%{transform:translate(-1%,1%)}}@keyframes flicker{0%{opacity:1}3%{opacity:.4}6%{opacity:1}7%{opacity:.7}8%{opacity:1}50%{opacity:1}52%{opacity:.6}53%{opacity:1}to{opacity:1}}@keyframes color-shift{0%{filter:hue-rotate()}33%{filter:hue-rotate(10deg)}66%{filter:hue-rotate(-10deg)}to{filter:hue-rotate()}}@keyframes scanline-scroll{0%{background-position:0 0}to{background-position:0 8px}}@keyframes chaos-border{0%{border-color:var(--border)}20%{border-color:var(--accent-3)}40%{border-color:var(--accent)}60%{border-color:var(--accent-2)}80%{border-color:var(--accent-3)}to{border-color:var(--border)}}@keyframes text-shadow-glitch{0%{text-shadow:none}20%{text-shadow:-2px 0 var(--accent-3), 2px 0 var(--accent-2)}40%{text-shadow:2px 0 var(--accent), -1px 0 var(--accent-3)}60%{text-shadow:none}80%{text-shadow:1px 0 var(--accent-2), -2px 0 var(--accent)}to{text-shadow:none}}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);flex-direction:column;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6;display:flex;position:relative}body:after{content:"";pointer-events:none;z-index:9999;opacity:.5;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.03'/%3E%3C/svg%3E");width:200%;height:200%;animation:.5s steps(8,end) infinite grain;position:fixed;inset:-50%}a{color:inherit;text-decoration:none}ul{list-style:none}img{max-width:100%}main{flex:1}button.btn{font-family:inherit;line-height:1.6}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}.container{width:100%;max-width:1200px;margin:0 auto;padding:2rem 1.5rem 4rem}.nav-logo-text{letter-spacing:2px;color:var(--accent-2);font-size:1rem;font-weight:700;transition:color .2s}.nav-logo-text:hover{color:var(--accent)}.hero-logo{justify-content:center;margin-bottom:.75rem;display:flex}.glitch-svg-hero{width:min(620px,92vw);height:auto;display:block;overflow:visible}.glitch-text-hero{letter-spacing:2px;fill:var(--accent-2);font-size:64px;font-weight:800}.glitch-layer-1{fill:var(--accent-3);opacity:0;animation:1.8s infinite glitch-anim-1}.glitch-layer-2{fill:var(--accent);opacity:0;animation:1.8s .3s infinite glitch-anim-2}@keyframes glitch-anim-1{0%{opacity:0;transform:translate(0)}5%{opacity:.9;clip-path:polygon(0 15%,100% 15%,100% 35%,0 35%);transform:translate(-6px,2px)skew(-8deg)}7%{opacity:0;transform:translate(0)}15%{opacity:.7;clip-path:polygon(0 65%,100% 65%,100% 85%,0 85%);transform:translate(4px,-3px)skew(4deg)}17%{opacity:0}30%{opacity:0}33%{opacity:.8;clip-path:polygon(0 40%,100% 40%,100% 55%,0 55%);transform:translate(-8px,1px)skew(-12deg)}36%{opacity:0}50%{opacity:.6;clip-path:polygon(0 5%,100% 5%,100% 25%,0 25%);transform:translate(7px,-2px)skew(6deg)}52%{opacity:0}70%{opacity:0}73%{opacity:.9;clip-path:polygon(0 50%,100% 50%,100% 70%,0 70%);transform:translate(-5px,3px)skew(-6deg)}76%{opacity:0}85%{opacity:.5;clip-path:polygon(0 80%,100% 80%,100% 95%,0 95%);transform:translate(3px,-1px)skew(3deg)}87%{opacity:0}to{opacity:0}}@keyframes glitch-anim-2{0%{opacity:0;transform:translate(0)}3%{opacity:.7;clip-path:polygon(0 55%,100% 55%,100% 75%,0 75%);transform:translate(5px,-2px)skew(10deg)}6%{opacity:0;transform:translate(0)}20%{opacity:0}22%{opacity:.8;clip-path:polygon(0 10%,100% 10%,100% 30%,0 30%);transform:translate(-7px,3px)skew(-8deg)}25%{opacity:0}40%{opacity:.6;clip-path:polygon(0 35%,100% 35%,100% 50%,0 50%);transform:translate(6px,-1px)skew(5deg)}42%{opacity:0}60%{opacity:0}63%{opacity:.9;clip-path:polygon(0 70%,100% 70%,100% 90%,0 90%);transform:translate(-4px,2px)skew(-10deg)}66%{opacity:0}80%{opacity:.4;clip-path:polygon(0 20%,100% 20%,100% 40%,0 40%);transform:translate(8px,-3px)skew(7deg)}83%{opacity:0}to{opacity:0}}.navbar{z-index:100;background:var(--bg-nav);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:.6rem 1.5rem;display:flex;position:sticky;top:0}.nav-logo{align-items:center;display:flex}.nav-links{align-items:center;gap:.25rem;display:flex}.nav-links a{border-radius:var(--radius);color:var(--text-muted);padding:.4rem .8rem;font-size:.9rem;transition:color .2s,background .2s;position:relative}.nav-links a:hover,.nav-links a.active{color:var(--accent-2);background:#3fefc812;animation:2s steps(3,end) infinite text-shadow-glitch}.nav-toggle{color:var(--text);cursor:pointer;background:0 0;border:none;padding:.2rem .5rem;font-size:1.4rem;display:none}.hero{text-align:center;justify-content:center;align-items:center;padding:3rem 1.5rem;animation:6s infinite flicker;display:flex;position:relative;overflow:hidden}.hero:before{content:"";pointer-events:none;background:radial-gradient(80% 50% at 50% 0,#7c6af72e 0%,#0000 70%),radial-gradient(50% 40% at 80% 80%,#3fefc81a 0%,#0000 60%);position:absolute;inset:0}.hero-content{z-index:1;width:100%;max-width:750px;position:relative}.hero-title{background:linear-gradient(135deg, var(--accent-2) 0%, var(--accent) 60%, var(--accent-3) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:.75rem;font-size:clamp(1.4rem,3.5vw,2.4rem);font-weight:800;line-height:1.2}.hero-sub{color:var(--text-muted);max-width:500px;margin-bottom:1.75rem;margin-left:auto;margin-right:auto;font-size:1rem}.hero-actions{flex-wrap:wrap;justify-content:center;gap:1rem;display:flex}.scanlines{pointer-events:none;z-index:0;background:repeating-linear-gradient(#0000,#0000 2px,#0000002e 2px 4px);animation:.4s linear infinite scanline-scroll;position:absolute;inset:0}body:before{content:"";pointer-events:none;z-index:9998;background:repeating-linear-gradient(#0000,#0000 3px,#00000014 3px 6px);position:fixed;inset:0}.page-header{text-align:center;border-bottom:1px solid var(--accent-3);background:linear-gradient(#f73f7c0f 0%,#7c6af70a 50%,#0000 100%);padding:3.5rem 1.5rem 1.5rem}.page-header h1{margin-bottom:.5rem;font-size:clamp(1.8rem,4vw,2.8rem);font-weight:800}.page-header p{color:var(--text-muted);font-size:1.05rem}.btn{border-radius:var(--radius);cursor:pointer;border:none;align-items:center;gap:.4rem;padding:.6rem 1.3rem;font-size:.9rem;font-weight:600;text-decoration:none;transition:opacity .2s,transform .15s,box-shadow .2s;display:inline-flex}.btn:hover{opacity:.88;transform:translateY(-1px)skew(-1deg)}.btn:active{transform:translateY(0)skew(0)}.btn-primary{background:var(--accent);color:#fff;box-shadow:0 2px 16px #7c6af74d}.btn-outline{color:var(--accent-2);border:1.5px solid var(--accent-2);background:0 0}.btn-outline:hover{background:#3fefc814}.btn-sm{padding:.4rem .9rem;font-size:.82rem}.btn-youtube{background:var(--youtube);color:#fff}.btn-itch{background:var(--itch);color:#fff}.btn-github{background:var(--github-btn);color:var(--text);border:1px solid var(--border)}.btn-danger{border:1px solid var(--accent-3);color:var(--accent-3);background:0 0;transition:background .2s,color .2s}.btn-danger:hover{color:#fff;background:#f73f7c1f}.icon-yt{width:16px;height:16px}.section-block{margin-bottom:4rem}.section-title{color:var(--text);margin-bottom:1.5rem;font-size:1.4rem;font-weight:700;display:inline-block;position:relative}.accent{color:var(--accent);margin-right:.3rem;animation:3s infinite color-shift}.section-footer{text-align:center;margin-top:1.5rem}.filter-bar{flex-wrap:wrap;gap:.5rem;margin-bottom:2rem;display:flex}.filter-btn{border:1.5px solid var(--border);color:var(--text-muted);cursor:pointer;background:0 0;border-radius:999px;padding:.35rem .9rem;font-size:.85rem;transition:all .2s}.filter-btn:hover{border-color:var(--accent-2);color:var(--accent-2)}.filter-btn.active{background:var(--accent);border-color:var(--accent);color:#fff}.card-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.4rem;display:grid}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);flex-direction:column;gap:.8rem;padding:1.4rem 1.5rem;transition:border-color .2s,transform .2s,box-shadow .2s;display:flex;position:relative;overflow:hidden}.card:nth-child(3n+1){transform:rotate(-.4deg)}.card:nth-child(3n+2){transform:rotate(.6deg)}.card:nth-child(3n){transform:rotate(-.3deg)}.card:before{content:"";background:linear-gradient(90deg, var(--accent-3) 0%, var(--accent) 50%, var(--accent-2) 100%);opacity:0;height:3px;transition:opacity .25s;position:absolute;top:0;left:0;right:0}.card:hover{border-color:var(--accent);box-shadow:0 0 20px #f73f7c40,0 0 40px #7c6af726}.card:hover:before{opacity:1}.card h3{color:#fff;font-size:1.05rem;font-weight:700}.card p{color:var(--text-muted);flex:1;font-size:.9rem}.card-engine-tag{letter-spacing:.05em;text-transform:uppercase;color:var(--tag-godot);background:#4a90d926;border:1px solid #4a90d94d;border-radius:999px;align-self:flex-start;padding:.15rem .6rem;font-size:.72rem;font-weight:700;display:inline-block}.card-engine-tag.raylib{color:var(--tag-raylib);background:#e8a83826;border-color:#e8a8384d}.card-engine-tag.unity{color:var(--tag-unity);background:#aaaaaa1f;border-color:#aaaaaa40}.card-engine-tag.unreal{color:var(--tag-unreal);background:#0f80e026;border-color:#0f80e04d}.card-engine-tag.other{color:var(--tag-other);background:#6b739626;border-color:#6b739640}.card-meta{flex-wrap:wrap;gap:.4rem;display:flex}.card-meta li{color:var(--text-muted);border:1px solid var(--border);background:#ffffff0a;border-radius:999px;padding:.15rem .55rem;font-size:.75rem}.card-links{flex-wrap:wrap;gap:.5rem;margin-top:auto;display:flex}.card.hidden{display:none}.about-grid{grid-template-columns:1fr 300px;align-items:start;gap:3rem;display:grid}.about-text{flex-direction:column;gap:1.2rem;display:flex}.about-text h2{color:var(--accent-2);margin-top:.5rem;font-size:1.3rem;font-weight:700}.about-text p{color:var(--text-muted);line-height:1.8}.about-list{flex-direction:column;gap:.6rem;display:flex}.about-list li{color:var(--text-muted);padding-left:.5rem}.tech-tags{flex-wrap:wrap;gap:.5rem;display:flex}.tech-tag{color:var(--accent);font-size:.82rem;font-family:var(--font-mono), serif;background:#7c6af71f;border:1px solid #7c6af740;border-radius:999px;padding:.25rem .75rem}.social-links{flex-wrap:wrap;gap:.75rem;display:flex}.about-aside{flex-direction:column;gap:1.5rem;display:flex;position:sticky;top:80px}.about-avatar-placeholder{background:linear-gradient(135deg, var(--accent), var(--accent-2));color:#fff;border-radius:50%;justify-content:center;align-items:center;width:120px;height:120px;margin:0 auto;font-size:2rem;font-weight:800;display:flex;box-shadow:0 0 30px #7c6af766}.about-stats{grid-template-columns:1fr 1fr;gap:1rem;display:grid}.stat-block{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);text-align:center;flex-direction:column;gap:.25rem;padding:1rem .75rem;display:flex}.stat-num{color:var(--accent-2);font-size:1.6rem;font-weight:800;font-family:var(--font-mono), serif}.stat-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.07em;font-size:.7rem}.back-link{color:var(--accent-2);margin-bottom:.75rem;font-size:.85rem;transition:color .2s;display:inline-block}.back-link:hover{color:var(--accent)}.detail-page{flex-direction:column;gap:1.5rem;max-width:800px;margin:0 auto;display:flex}.detail-meta-row{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.detail-summary{color:var(--text);border-left:3px solid var(--accent);padding-left:1rem;font-size:1.1rem;line-height:1.7}.detail-body{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.5rem 1.75rem;position:relative;overflow:hidden}.detail-body:before{content:"";background:linear-gradient(90deg, var(--accent-3) 0%, var(--accent) 50%, var(--accent-2) 100%);height:3px;position:absolute;top:0;left:0;right:0}.detail-body p{color:var(--text-muted);font-size:.95rem;line-height:1.9}.detail-actions{flex-wrap:wrap;gap:.75rem;padding-top:.5rem;display:flex}.card-image{border-radius:var(--radius-lg) var(--radius-lg) 0 0;margin:-1.4rem -1.5rem 0;line-height:0;overflow:hidden}.card-image img{object-fit:cover;filter:brightness(.85)saturate(.9);width:100%;height:160px;transition:transform .3s,filter .3s;display:block}.card:hover .card-image img{filter:brightness()saturate(1.1);transform:scale(1.04)}.card-view-link{color:var(--accent-2);margin-top:auto;font-size:.82rem;font-weight:600;transition:color .2s}.card:hover .card-view-link{color:var(--accent)}a.card{color:inherit;cursor:pointer;text-decoration:none}.detail-hero-image{border-radius:var(--radius-lg);border:1px solid var(--border);line-height:0;overflow:hidden}.detail-hero-image img{object-fit:cover;width:100%;height:auto;max-height:400px;display:block}.devlog-list{flex-direction:column;gap:1rem;display:flex}.devlog-list-item{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);color:inherit;cursor:pointer;flex-direction:column;gap:.6rem;padding:1.4rem 1.5rem;text-decoration:none;transition:border-color .2s,box-shadow .2s,transform .15s;display:flex;position:relative;overflow:hidden}.devlog-list-item:before{content:"";background:linear-gradient(90deg, var(--accent-3) 0%, var(--accent) 50%, var(--accent-2) 100%);opacity:0;height:3px;transition:opacity .25s;position:absolute;top:0;left:0;right:0}.devlog-list-item:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:0 0 20px #f73f7c33,0 0 40px #7c6af71a}.devlog-list-item:hover:before{opacity:1}.devlog-list-item-header{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:1rem;display:flex}.devlog-list-item h3{color:#fff;font-size:1.1rem;font-weight:700}.devlog-list-item-date{color:var(--text-muted);font-size:.8rem;font-family:var(--font-mono), serif;white-space:nowrap}.devlog-list-item p{color:var(--text-muted);font-size:.9rem;line-height:1.6}.devlog-detail-meta{color:var(--text-muted);justify-content:center;align-items:center;gap:1rem;margin-top:.5rem;font-size:.85rem;display:flex}.devlog-detail-meta time{font-family:var(--font-mono), serif}.devlog-detail-project{color:var(--accent);background:#7c6af726;border:1px solid #7c6af74d;border-radius:999px;padding:.15rem .6rem;font-size:.75rem;font-weight:600}.footer{text-align:center;border-top:1px solid var(--border);color:var(--text-muted);border-top-color:var(--accent-3);flex-direction:column;align-items:center;gap:.75rem;padding:2rem 1.5rem;font-size:.85rem;display:flex;box-shadow:0 -2px 20px #f73f7c1a}.footer-links{gap:1.5rem;display:flex}.footer-links a{color:var(--text-muted);transition:color .2s}.footer-links a:hover{color:var(--accent-2)}@media (max-width:768px){.nav-toggle{display:block}.nav-links{background:var(--bg-nav);border-bottom:1px solid var(--border);flex-direction:column;gap:.2rem;padding:1rem 1.5rem 1.5rem;display:none;position:absolute;top:100%;left:0;right:0}.nav-links.open{display:flex}.nav-links a{padding:.55rem .75rem}.about-grid{grid-template-columns:1fr}.about-aside{position:static}.card-grid{grid-template-columns:1fr}.detail-body{padding:1.25rem 1rem}.detail-actions{flex-direction:column}.devlog-list-item-header{flex-direction:column;gap:.25rem}}@media (max-width:480px){.hero{padding:2rem 1rem}.glitch-text-hero{font-size:44px}.glitch-svg-hero{width:96vw}.hero-actions{flex-direction:column;align-items:center}}.nav-logout-btn{border:1px solid var(--accent-3);color:var(--accent-3);border-radius:var(--radius);cursor:pointer;background:0 0;padding:.3rem .8rem;font-size:.85rem;font-weight:600;transition:background .2s,color .2s}.nav-logout-btn:hover{color:#fff;background:#f73f7c1f}
