:root{--bg-color:#0a0a0a;--text-primary:#fff;--text-secondary:#a3a3a3;--glass-bg:#1a1a1ad9;--glass-border:#ffffff0d;--accent-color:#a855f7;--font-family:"Outfit", sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);background-color:var(--bg-color);color:var(--text-primary);-webkit-font-smoothing:antialiased;min-height:100vh;overflow-x:hidden}.app-container{justify-content:center;align-items:center;min-height:100vh;padding:3rem 1rem;display:flex;position:relative;overflow:hidden}.content-wrapper{z-index:10;opacity:0;flex-direction:column;align-items:center;width:100%;max-width:480px;transition:opacity .8s ease-out,transform .8s ease-out;display:flex;position:relative;transform:translateY(20px)}.content-wrapper.visible{opacity:1;transform:translateY(0)}.profile-card{text-align:center;background:#1a1a1a;border:1px solid #ffffff0d;border-radius:20px;width:100%;margin-bottom:2.5rem;padding:2.5rem 2rem;position:relative;overflow:hidden;box-shadow:0 20px 40px -10px #00000080}.avatar-container{width:130px;height:130px;margin:0 auto 1.5rem;position:relative}.avatar{object-fit:cover;background:linear-gradient(135deg,#3b82f6,#a855f7,#ec4899);border:2px solid #ffffff1a;border-radius:20px;width:100%;height:100%;transition:transform .3s}.avatar-container:hover .avatar{transform:scale(1.05)rotate(2deg)}.name{color:#fff;letter-spacing:-.01em;margin-bottom:.25rem;font-size:1.8rem;font-weight:700}.bio{color:#a855f7;letter-spacing:.05em;margin-bottom:1rem;font-size:1.1rem;font-weight:600}.location{color:#94a3b8;justify-content:center;align-items:center;gap:.5rem;margin-bottom:1.5rem;font-size:.9rem;display:flex}.location-icon{color:#a855f7}.mini-socials{justify-content:center;gap:1rem;margin-bottom:1.5rem;display:flex}.mini-socials a{color:#fff;background:#2a2a2a;border-radius:12px;justify-content:center;align-items:center;width:40px;height:40px;font-size:1.1rem;text-decoration:none;transition:all .3s;display:flex}.mini-socials a:hover{color:#a855f7;background:#333;transform:translateY(-3px)}.card-buttons{flex-direction:column;gap:.75rem;display:flex}.btn{cursor:pointer;border-radius:12px;justify-content:center;align-items:center;gap:.5rem;width:100%;padding:.85rem;font-size:1rem;font-weight:600;text-decoration:none;transition:all .3s;display:flex}.btn-primary{color:#fff;background:#a855f7;border:none}.btn-primary:hover{background:#9333ea;box-shadow:0 4px 15px #a855f766}.btn-outline{color:#fff;background:#2a2a2a;border:1px solid #ffffff0d}.btn-outline:hover{background:#333;border-color:#ffffff1a}.links-section{flex-direction:column;gap:1rem;width:100%;display:flex}.link-card{background:var(--glass-bg);border:1px solid var(--glass-border);color:var(--text-primary);-webkit-backdrop-filter:blur(16px);opacity:0;animation:.6s ease-out forwards slideUp;animation-delay:calc(.1s + (var(--animation-order) * .1s));border-radius:16px;align-items:center;padding:.75rem;text-decoration:none;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.link-card:hover{background:#ffffff0d;border-color:#ffffff40;transform:translateY(-4px)scale(1.02);box-shadow:0 10px 25px -5px #0000004d,0 8px 10px -6px #0000001a}.link-icon-wrapper{background:var(--brand-bg);color:#fff;border-radius:12px;justify-content:center;align-items:center;width:50px;height:50px;margin-right:1.25rem;font-size:1.5rem;transition:transform .3s;display:flex;box-shadow:0 4px 10px #00000026}.link-card:hover .link-icon-wrapper{transform:scale(1.1)rotate(5deg)}.link-title{letter-spacing:.01em;flex-grow:1;font-size:1.1rem;font-weight:500}.link-arrow{opacity:0;color:var(--text-secondary);margin-right:.5rem;font-size:1.2rem;transition:all .3s;transform:translate(-10px)}.link-card:hover .link-arrow{opacity:1;color:var(--text-primary);transform:translate(0)}.footer{text-align:center;color:var(--text-secondary);opacity:0;margin-top:3rem;font-size:.9rem;animation:1s ease-out .8s forwards fadeIn}@keyframes fadeIn{to{opacity:1}}@media (width<=480px){.app-container{padding:2rem 1rem}.name{font-size:1.6rem}.link-icon-wrapper{width:45px;height:45px;font-size:1.3rem}}
