:root{--bg-main:#05050a;--glass-bg:#0f0f1473;--glass-border:#00f3ff26;--accent-1:#00f3ff;--accent-2:#bd00ff;--text-primary:#f8fafc;--text-secondary:#94a3b8;--font-sans:"Inter", system-ui, -apple-system, sans-serif;--font-display:"Space Grotesk", "Outfit", system-ui, sans-serif}*,:before,:after{box-sizing:border-box}body{font-family:var(--font-sans);background-color:var(--bg-main);color:var(--text-primary);background-image:url(/dark_anime_bg.png);background-position:50%;background-size:cover;background-attachment:fixed;margin:0;line-height:1.6;overflow-x:hidden}body:before{content:"";-webkit-backdrop-filter:blur(5px);z-index:-1;background:#05050cb3;width:100%;height:100%;position:fixed;top:0;left:0}.app-container{grid-template-columns:320px 1fr;align-items:start;gap:30px;max-width:1300px;margin:0 auto;padding:60px 20px;display:grid}@media (width<=1200px){.app-container{grid-template-columns:1fr;padding:20px}.profile-bento{position:relative;top:0}.projects-bento{grid-template-columns:1fr}}@media (width<=768px){.hero-bento h2{font-size:1.8rem}.hero-bento,.profile-bento{padding:30px 20px}}.glass-panel{background:var(--glass-bg);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(16px);border-radius:24px;box-shadow:0 10px 40px #00000080}.profile-bento{text-align:center;padding:40px 30px;position:sticky;top:60px}.avatar-container{cursor:pointer;width:160px;height:160px;margin:0 auto 24px;position:relative}.anime-avatar{border:2px solid var(--accent-1);object-fit:cover;border-radius:50%;width:100%;height:100%;transition:all .6s cubic-bezier(.4,0,.2,1);position:absolute;top:0;left:0;box-shadow:0 0 25px #00f3ff4d}.base-avatar{opacity:1;transform:scale(1)}.base-avatar.hidden{opacity:0;transform:scale(.8)}.overlay-avatar{opacity:0;border-color:var(--accent-2);transform:scale(1.2);box-shadow:0 0 40px #bd00ff66}.overlay-avatar.visible{opacity:1;transform:scale(1)}.avatar-container:hover .anime-avatar{transform:scale(1.05);box-shadow:0 0 35px #00f3ff99}.avatar-container:hover .overlay-avatar.visible{transform:scale(1.05);box-shadow:0 0 50px #bd00ffcc}.role-badge{color:var(--accent-1);text-transform:uppercase;letter-spacing:2px;background:#00f3ff1a;border:1px solid #00f3ff4d;border-radius:20px;margin-bottom:20px;padding:6px 14px;font-size:.8rem;font-weight:600;display:inline-block}.main-bento-grid{flex-direction:column;gap:30px;min-width:0;display:flex}.projects-bento{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:24px;display:grid}.project-card{flex-direction:column;padding:24px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex}.project-card:hover{border-color:var(--accent-1);transform:translateY(-8px);box-shadow:0 12px 30px #00f3ff26}h1{font-family:var(--font-display);color:#fff;margin:0 0 10px;font-size:2rem}h2{font-family:var(--font-display);color:#fff;margin:0 0 20px;font-size:1.8rem}h3{font-family:var(--font-display);color:#fff;margin:0 0 10px;font-size:1.3rem}.tech-tag{color:var(--text-secondary);background:#ffffff08;border:1px solid #ffffff1a;border-radius:8px;padding:6px 12px;font-size:.75rem}.social-links{justify-content:center;gap:15px;margin-top:30px;display:flex}.social-icon{width:45px;height:45px;color:var(--text-primary);background:#ffffff0d;border:1px solid #ffffff1a;border-radius:50%;justify-content:center;align-items:center;transition:all .3s;display:flex}.social-icon:hover{background:var(--accent-1);color:#000;box-shadow:0 0 15px var(--accent-1);transform:translateY(-5px)}.hero-bento{margin-bottom:0;padding:40px}.hero-bento h2{background:linear-gradient(90deg, #fff, var(--accent-1));-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:20px;font-size:2.5rem;line-height:1.2}.btn{border-radius:12px;justify-content:center;align-items:center;padding:14px 24px;font-weight:600;text-decoration:none;transition:all .3s;display:inline-flex}.btn-primary{background:var(--accent-1);color:#000;box-shadow:0 0 15px #00f3ff4d}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 0 25px #00f3ff80}.project-img{object-fit:cover;border:1px solid #ffffff0d;border-radius:12px;width:100%;height:180px;margin-bottom:20px}.glow-text{text-shadow:0 0 15px #00f3ff66}
