:root{--primary: #6366f1;--primary-dark: #4f46e5;--secondary: #10b981;--dark: #0f172a;--dark-light: #1e293b;--light: #f8fafc;--gray: #94a3b8;--glass: rgba(255, 255, 255, .1);--glass-border: rgba(255, 255, 255, .2);--shadow: 0 10px 15px -3px rgba(0, 0, 0, .1);--project-bg: rgba(255, 255, 255, .1);--project-border: rgba(255, 255, 255, .2);--text-primary: #f8fafc;--text-secondary: #94a3b8}*{margin:0;padding:0;box-sizing:border-box;font-family:Inter,Segoe UI,system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;transition:background-color .3s,transform .2s;-webkit-tap-highlight-color:transparent}body{background:var(--dark);color:var(--light);display:flex;justify-content:center;align-items:center;min-height:100vh;padding:20px;transition:background .5s ease}body.light-mode{background:#f1f5f9;color:var(--dark);--glass: rgba(241, 245, 249, .8);--glass-border: #e2e8f0;--project-bg: rgba(241, 245, 249, .8);--project-border: #e2e8f0;--text-primary: #0f172a;--text-secondary: #64748b}.biolink-container{width:100%;max-width:900px;background:var(--dark-light);border-radius:20px;box-shadow:var(--shadow);overflow:hidden;position:relative}body.light-mode .biolink-container{background:#fff;box-shadow:0 10px 25px #00000014}.banner{width:100%;height:160px;background:url(https://iili.io/FL1PpMG.png) center center / cover no-repeat;position:relative;overflow:hidden}.profile-pic{position:absolute;top:120px;left:50%;transform:translate(-50%);width:120px;height:120px;border-radius:50%;border:4px solid var(--dark-light);background:url(https://iili.io/FLGhvQS.md.jpg) center/cover;box-shadow:0 8px 25px #0000004d;transition:transform .3s ease,box-shadow .3s ease}body.light-mode .profile-pic{border-color:#fff}.profile-pic:hover{transform:translate(-50%) scale(1.05);box-shadow:0 12px 30px #0006}.content{padding:160px 20px 20px;text-align:center;position:relative}.page{display:none}.page.active{display:block}.name,body.light-mode .name{font-weight:800;font-size:1.8rem;margin-bottom:5px;background:linear-gradient(90deg,var(--primary),var(--secondary));-webkit-background-clip:text;background-clip:text;color:transparent;margin-top:-70px}.username{font-weight:600;font-size:1rem;color:var(--gray);margin-bottom:5px}.title{font-size:.9rem;color:var(--gray);margin-bottom:20px;display:flex;justify-content:center;align-items:center;gap:5px}.stats{display:flex;justify-content:center;gap:20px;margin:25px 0}.stat-item{text-align:center;transition:transform .3s ease}.stat-item:hover{transform:translateY(-5px)}.stat-value{font-weight:800;font-size:1.4rem;background:linear-gradient(90deg,var(--primary),var(--secondary));-webkit-background-clip:text;background-clip:text;color:transparent}.stat-label{font-size:.7rem;color:var(--gray);text-transform:uppercase;letter-spacing:1px;margin-top:3px}.links{display:flex;flex-direction:column;gap:15px;margin-top:25px}.link-btn{display:flex;align-items:center;justify-content:center;gap:10px;background:var(--glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--text-primary);text-decoration:none;padding:15px;border-radius:12px;font-weight:600;border:1px solid var(--glass-border);transition:all .3s ease;position:relative;overflow:hidden}.link-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:.5s}.link-btn:hover{transform:translateY(-3px);border-color:var(--primary);box-shadow:0 5px 15px #6366f14d}.link-btn:hover:before{left:100%}.link-btn:active{transform:translateY(0) scale(.98)}.link-icon{font-size:1.2rem}.theme-toggle{position:absolute;top:20px;right:20px;width:40px;height:40px;border-radius:50%;background:var(--glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--glass-border);display:flex;justify-content:center;align-items:center;cursor:pointer;z-index:3;color:var(--text-primary);transition:all .3s ease,transform .5s ease}.theme-toggle:hover{transform:rotate(180deg) scale(1.1)}.skills{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:20px 0}.skill-tag{background:#6366f133;color:#c7d2fe;padding:5px 12px;border-radius:20px;font-size:.75rem;font-weight:600;transition:all .3s ease}.skill-tag:hover{transform:translateY(-2px);background:#6366f14d}body.light-mode .skill-tag{background:#e0e7ff;color:var(--primary-dark)}.pagination{display:flex;justify-content:center;gap:10px;margin:30px 0 20px}.page-number{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--glass);border:1px solid var(--glass-border);color:var(--text-primary);font-weight:600;cursor:pointer;transition:all .3s ease}.page-number.active{background:var(--primary);color:#fff;transform:scale(1.1)}.page-number:hover:not(.active){transform:translateY(-3px);border-color:var(--primary)}.copyright{text-align:center;font-size:.8rem;color:var(--gray);padding:15px 0;margin-top:10px}.project{background:var(--project-bg);border-radius:12px;padding:15px;margin-bottom:15px;border:1px solid var(--project-border);transition:all .3s ease}.project:hover{transform:translateY(-5px);box-shadow:0 10px 20px #0000001a}.project-title{font-weight:700;margin-bottom:5px;color:var(--text-primary)}.project-desc{text-align:left;font-size:.85rem;color:var(--text-secondary);margin-bottom:10px}.project-tech{display:flex;flex-wrap:wrap;gap:5px}.project-tech-tag{background:#10b98133;color:#a7f3d0;padding:3px 8px;border-radius:20px;font-size:.7rem}body.light-mode .project-tech-tag{background:#d1fae5;color:#065f46}.about-text{text-align:left;margin:20px 0;line-height:1.6;color:var(--text-secondary)}.project-links{display:flex;gap:10px;font-size:1.2rem;justify-content:flex-end;margin-top:8px}.project-links a{color:var(--text-primary);background:transparent;padding:4px 6px;border-radius:6px;transition:background-color .3s ease,color .3s ease;text-decoration:none}.project-links a:hover{color:var(--primary);background:#6366f133}@keyframes clickEffect{0%{transform:scale(1)}50%{transform:scale(.95)}to{transform:scale(1)}}.click-animation{animation:clickEffect .3s ease}
