body{font-family:Arial,Microsoft YaHei,sans-serif;line-height:1.6;color:var(--text-primary);background-color:var(--bg-primary);background-image:url('data:image/svg+xml,%3Csvg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"%3E%3Cfilter id="noiseFilter"%3E%3CfeTurbulence type="fractalNoise" baseFrequency="0.65" numOctaves="3" stitchTiles="stitch"/%3E%3C/filter%3E%3Crect width="100%" height="100%" filter="url(%23noiseFilter)" opacity="0.1"/%3E%3C/svg%3E');transition:background-color .3s,color .3s;overflow-x:hidden;width:100%}.hero:before{content:"";position:absolute;inset:0;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="20" cy="20" r="2" fill="rgba(255,107,107,0.1)"/><circle cx="50" cy="50" r="1" fill="rgba(255,107,107,0.1)"/><circle cx="80" cy="80" r="1.5" fill="rgba(255,107,107,0.1)"/></svg>');background-size:100px 100px}.hero[data-v-0ed02e49]{position:relative;width:100%;min-height:100vh;overflow:hidden;display:flex;align-items:center}.hero-content[data-v-0ed02e49]{position:relative;z-index:10;width:100%;height:100%}.hero-text[data-v-0ed02e49]{position:relative;z-index:20;text-align:center;width:100%;box-sizing:border-box}.particles-canvas[data-v-0ed02e49]{position:absolute;top:0;left:0;width:100%;height:100%;display:block;pointer-events:none;z-index:1;background:transparent;visibility:visible;opacity:1}@media(min-width:768px){.hero-text[data-v-0ed02e49]{text-align:left;align-items:flex-start;padding-left:4rem}}@media(max-width:767px){.hero-text[data-v-0ed02e49]{text-align:center;align-items:center;padding-left:0}}.hero-title[data-v-0ed02e49]{margin-bottom:1rem}.hero-subtitle[data-v-0ed02e49]{margin-bottom:2rem}.cta-button[data-v-0ed02e49]{margin-top:1rem}.achievement-icon[data-v-1ab82a42]{margin-right:8px;font-size:1rem}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}:root{--bg-primary: #1a1a1a;--bg-secondary: #2d2d2d;--bg-tertiary: #3d3d3d;--text-primary: #f0f0f0;--text-secondary: #b0b0b0;--accent-pink: #FF6B6B;--accent-purple: #9B59B6;--accent-blue: #3498DB;--accent-orange: #F39C12;--border-color: #444;--shadow-color: rgba(0, 0, 0, .3)}body{font-family:Arial,Microsoft YaHei,sans-serif;line-height:1.6;color:var(--text-primary);background-color:var(--bg-primary);background-image:url('data:image/svg+xml,%3Csvg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"%3E%3Cfilter id="noiseFilter"%3E%3CfeTurbulence type="fractalNoise" baseFrequency="0.65" numOctaves="3" stitchTiles="stitch"/%3E%3C/filter%3E%3Crect width="100%" height="100%" filter="url(%23noiseFilter)" opacity="0.1"/%3E%3C/svg%3E');transition:background-color .3s,color .3s;overflow-x:hidden;width:100%}.container{max-width:1200px;margin:0 auto;padding:0 20px;width:100%;box-sizing:border-box}.header{background:var(--bg-secondary);box-shadow:0 2px 10px var(--shadow-color);position:fixed;top:0;left:0;right:0;z-index:1000;transition:all .3s cubic-bezier(.68,-.55,.265,1.55)}.nav-container{max-width:1200px;margin:0 auto;padding:0 20px;display:flex;justify-content:space-between;align-items:center;height:70px;width:100%;box-sizing:border-box}.logo h1{color:var(--accent-pink);font-size:1.5rem;font-weight:700;text-shadow:0 0 10px rgba(255,107,107,.5)}.nav-menu{display:flex;list-style:none;gap:30px}.nav-link{text-decoration:none;color:var(--text-primary);font-weight:500;transition:color .3s cubic-bezier(.68,-.55,.265,1.55);position:relative}.nav-link:hover{color:var(--accent-pink);text-shadow:0 0 5px rgba(255,107,107,.5)}.nav-link:after{content:"";position:absolute;bottom:-5px;left:0;width:0;height:2px;background-color:var(--accent-pink);box-shadow:0 0 5px var(--accent-pink);transition:width .3s cubic-bezier(.68,-.55,.265,1.55)}.nav-link:hover:after{width:100%}.language-toggle{display:flex;gap:5px;margin-left:20px}#lang-toggle,#lang-toggle-en{padding:5px 10px;border:1px solid var(--border-color);background:var(--bg-secondary);color:var(--text-primary);cursor:pointer;border-radius:3px;font-size:14px;transition:all .3s cubic-bezier(.68,-.55,.265,1.55)}#lang-toggle:hover,#lang-toggle-en:hover{background:var(--bg-tertiary);border-color:var(--accent-pink);box-shadow:0 0 5px #ff6b6b4d}#lang-toggle.active,#lang-toggle-en.active{background:var(--accent-pink);color:var(--bg-primary);border-color:var(--accent-pink);box-shadow:0 0 10px #ff6b6b80;font-weight:700}.hamburger{display:none;flex-direction:column;cursor:pointer}.hamburger span{width:25px;height:3px;background-color:var(--accent-pink);margin:3px 0;transition:.3s;box-shadow:0 0 5px #ff6b6b80}main{margin-top:70px}.hero{background:linear-gradient(135deg,var(--bg-primary) 0%,var(--bg-secondary) 100%);color:var(--text-primary);text-align:left;min-height:100vh;display:flex;align-items:center;position:relative;overflow:hidden;border-bottom:1px solid var(--accent-pink);box-shadow:0 0 20px #ff6b6b1a}.hero:before{content:"";position:absolute;inset:0;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="20" cy="20" r="2" fill="rgba(255,107,107,0.1)"/><circle cx="50" cy="50" r="1" fill="rgba(255,107,107,0.1)"/><circle cx="80" cy="80" r="1.5" fill="rgba(255,107,107,0.1)"/></svg>');background-size:100px 100px}.hero-content{max-width:800px;padding:0 20px;position:relative;z-index:2;width:100%;box-sizing:border-box}.hero-title{font-size:3rem;margin-bottom:20px;color:var(--accent-pink);text-shadow:0 0 15px rgba(255,107,107,.5);animation:fadeInUp 1s cubic-bezier(.68,-.55,.265,1.55)}.hero-subtitle{font-size:1.2rem;margin-bottom:30px;opacity:.9;color:var(--text-secondary);animation:fadeInUp 1s cubic-bezier(.68,-.55,.265,1.55) .3s both}.cta-button{background:var(--accent-pink);color:var(--bg-primary);border:none;padding:15px 30px;font-size:1.1rem;border-radius:50px;cursor:pointer;transition:all .3s cubic-bezier(.68,-.55,.265,1.55);animation:fadeInUp 1s cubic-bezier(.68,-.55,.265,1.55) .6s both;font-weight:700;box-shadow:0 4px 15px #ff6b6b4d}.cta-button:hover{transform:translateY(-2px);box-shadow:0 10px 20px #ff6b6b80;background:var(--accent-purple);color:var(--bg-primary)}.about{padding:80px 0;background-color:var(--bg-secondary);transition:background-color .3s;border-bottom:1px solid var(--border-color)}.section-title{text-align:center;font-size:2.5rem;margin-bottom:50px;color:var(--accent-pink);text-shadow:0 0 10px rgba(255,107,107,.3);position:relative}.section-title:after{content:"";position:absolute;bottom:-10px;left:50%;transform:translate(-50%);width:80px;height:4px;background:linear-gradient(135deg,var(--accent-pink) 0%,var(--accent-purple) 100%);border-radius:2px;box-shadow:0 0 10px #ff6b6b80}.about-content{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start;margin-bottom:20px}.about-left{display:flex;flex-direction:column;gap:30px}.about-right{display:flex;flex-direction:column;gap:30px;align-items:center}.about-text p{font-size:1.1rem;margin-bottom:20px;margin-top:2em;line-height:1.8}.skills-achievements-container{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-bottom:40px;align-items:stretch}.skills{display:flex;flex-direction:column;height:100%;background-color:var(--bg-tertiary);padding:20px;border-radius:10px;border:1px solid var(--border-color)}.skills h3{margin-bottom:20px;color:var(--accent-pink);text-align:center;flex-shrink:0;text-shadow:0 0 5px rgba(255,107,107,.3)}.skill-tags{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-content:center;height:100%}.skill-tag{padding:8px 16px;border-radius:20px;font-size:.9rem;font-weight:500;transition:all .3s cubic-bezier(.68,-.55,.265,1.55);box-shadow:0 3px 10px var(--shadow-color);min-height:80px;display:flex;align-items:center;justify-content:center;text-align:center;flex:0 0 auto;border:1px solid var(--border-color)}.skill-tag.expert{background:linear-gradient(135deg,var(--accent-pink) 0%,var(--accent-purple) 100%);color:var(--bg-primary);box-shadow:0 3px 10px #ff6b6b4d}.skill-tag.intermediate{background:linear-gradient(135deg,var(--accent-blue) 0%,var(--accent-purple) 100%);color:var(--text-primary);box-shadow:0 3px 10px #9b59b64d}.skill-tag.beginner{background:linear-gradient(135deg,var(--bg-tertiary) 0%,var(--border-color) 100%);color:var(--text-primary);box-shadow:0 3px 10px var(--shadow-color)}.skill-tag:hover{transform:translateY(-2px);box-shadow:0 5px 15px #ff6b6b4d}.achievements{width:100%;display:flex;flex-direction:column;height:100%;background-color:var(--bg-tertiary);padding:20px;border-radius:10px;border:1px solid var(--border-color)}.achievements h3{text-align:center;margin-bottom:20px;color:var(--accent-pink);font-size:1.2rem;flex-shrink:0;text-shadow:0 0 5px rgba(255,107,107,.3)}.achievement-list{display:flex;flex-direction:column;gap:10px;width:100%;align-items:center;flex:1;justify-content:space-evenly;padding:20px 0}.achievement-item{background:linear-gradient(135deg,var(--accent-pink) 0%,var(--accent-purple) 100%);width:100%;max-width:20rem;padding:12px 15px;border-radius:8px;font-weight:500;color:var(--bg-primary);text-align:center;transition:transform .3s cubic-bezier(.68,-.55,.265,1.55);box-shadow:0 4px 12px #ff6b6b4d;font-size:.9rem;border:1px solid var(--accent-pink);word-wrap:break-word;overflow-wrap:break-word}.achievement-item:hover{transform:translateY(-3px);box-shadow:0 8px 20px #ff6b6b80}.timeline-section{grid-column:1 / -1;margin-top:20px;background-color:var(--bg-tertiary);padding:30px;border-radius:10px;border:1px solid var(--border-color)}.timeline h3{text-align:center;margin-bottom:30px;color:var(--accent-pink);font-size:1.4rem;text-shadow:0 0 5px rgba(255,107,107,.3)}.timeline-container{position:relative;padding-left:30px;margin-top:20px}.timeline-container:before{content:"";position:absolute;left:15px;top:0;bottom:0;width:2px;background:linear-gradient(135deg,var(--accent-pink) 0%,var(--accent-purple) 100%);border-radius:2px;box-shadow:0 0 10px #ff6b6b4d}.timeline-item{position:relative;margin-bottom:25px;padding:20px;background:var(--bg-secondary);border-radius:10px;border-left:4px solid var(--accent-pink);transition:all .3s ease;border:1px solid var(--border-color);box-shadow:0 3px 10px var(--shadow-color)}.timeline-item:before{content:"";position:absolute;left:-37px;top:25px;width:12px;height:12px;background:var(--accent-pink);border-radius:50%;border:3px solid var(--bg-secondary);box-shadow:0 0 0 3px var(--accent-pink)}.timeline-date{font-weight:700;color:var(--accent-pink);font-size:.9rem;margin-bottom:5px;text-shadow:0 0 5px rgba(255,107,107,.3)}.timeline-content p{color:var(--text-secondary);margin:0;font-size:.95rem;line-height:1.6;white-space:pre-line;word-wrap:break-word;overflow-wrap:break-word}.profile-image{width:100%;max-width:250px;height:250px;display:flex;align-items:center;justify-content:center;border-radius:50%;box-shadow:0 15px 35px var(--shadow-color),0 0 20px #ff6b6b33;transition:transform .3s cubic-bezier(.68,-.55,.265,1.55),box-shadow .3s cubic-bezier(.68,-.55,.265,1.55);border:4px solid var(--accent-pink);margin-bottom:25px;overflow:hidden;background:linear-gradient(135deg,var(--bg-secondary) 0%,var(--bg-tertiary) 100%)}.profile-img{width:100%;height:100%;object-fit:cover;border-radius:50%;border:2px solid var(--border-color)}.profile-image:hover{transform:scale(1.05);box-shadow:0 20px 40px var(--shadow-color),0 0 30px #ff6b6b66}.projects{padding:80px 0;background-color:var(--bg-secondary);transition:background-color .3s;border-bottom:1px solid var(--border-color)}.projects-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px;margin-top:50px}@media(min-width:768px){.projects-grid{grid-template-columns:1fr 1.2fr}.projects-grid>.project-card:nth-child(3n){grid-column:span 2}}.project-card{background:var(--bg-tertiary);border-radius:10px;overflow:hidden;box-shadow:0 5px 15px var(--shadow-color);transition:transform .3s cubic-bezier(.68,-.55,.265,1.55),box-shadow .3s cubic-bezier(.68,-.55,.265,1.55);border:1px solid var(--border-color)}.project-card:hover{transform:translateY(-5px);box-shadow:0 15px 30px var(--shadow-color),0 0 20px #ff6b6b4d;border-color:var(--accent-pink)}.project-card:hover .project-img{transform:scale(1.05)}.project-image{height:200px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--accent-pink) 0%,var(--accent-purple) 100%);position:relative;overflow:hidden;border-bottom:1px solid var(--border-color)}.project-img{width:100%;height:100%;object-fit:cover;transition:transform .3s cubic-bezier(.68,-.55,.265,1.55);border-bottom:1px solid var(--border-color)}.project-img:hover{transform:scale(1.05)}.project-placeholder{font-size:4rem;color:#f0f0f0cc;text-shadow:0 0 10px rgba(255,107,107,.5)}.project-info{padding:25px}.project-info h3{margin-bottom:15px;color:var(--accent-pink);text-shadow:0 0 5px rgba(255,107,107,.3)}.project-info p{margin-bottom:20px;color:var(--text-secondary);line-height:1.6;word-wrap:break-word;overflow-wrap:break-word}.project-links{display:flex;gap:15px}.project-link{color:var(--accent-pink);text-decoration:none;font-weight:500;transition:all .3s cubic-bezier(.68,-.55,.265,1.55);padding:8px 16px;border-radius:4px;border:1px solid var(--accent-pink);background-color:var(--bg-secondary);box-shadow:0 2px 5px var(--shadow-color)}.project-link:hover{color:var(--bg-primary);background:var(--accent-pink);box-shadow:0 4px 10px #ff6b6b4d;transform:translateY(-2px)}.contact{padding:80px 0;background-color:var(--bg-secondary);transition:background-color .3s;border-bottom:1px solid var(--border-color)}.contact-content{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:start}.social-section{text-align:center;padding:20px;background-color:var(--bg-tertiary);border-radius:10px;border:1px solid var(--border-color);box-shadow:0 5px 15px var(--shadow-color)}.social-section h3{color:var(--accent-pink);font-size:1.4rem;margin-bottom:30px;text-align:center;text-shadow:0 0 5px rgba(255,107,107,.3)}.social-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:20px;max-width:400px;margin:0 auto}.social-item{display:flex;flex-direction:column;align-items:center;padding:20px;background:linear-gradient(135deg,var(--accent-pink) 0%,var(--accent-purple) 100%);color:var(--bg-primary);text-decoration:none;border-radius:10px;transition:all .3s ease;box-shadow:0 5px 15px #ff6b6b4d;border:1px solid var(--accent-pink)}.social-item:hover{transform:translateY(-3px);box-shadow:0 8px 25px #ff6b6b80}.social-icon{font-size:1.5rem;margin-bottom:8px}.social-item span:last-child{font-size:.9rem;font-weight:500}.contact-form{background:var(--bg-tertiary);padding:30px;border-radius:15px;box-shadow:0 5px 20px var(--shadow-color);transition:background-color .3s,box-shadow .3s;border:1px solid var(--border-color)}.contact-form h3{color:var(--accent-pink);margin-bottom:25px;font-size:1.3rem;text-align:center;text-shadow:0 0 5px rgba(255,107,107,.3)}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;color:var(--text-primary);font-weight:500;font-size:1rem}.form-group input,.form-group textarea{width:100%;padding:12px 15px;border:2px solid var(--border-color);border-radius:8px;font-size:1rem;transition:all .3s cubic-bezier(.68,-.55,.265,1.55);background:var(--bg-secondary);color:var(--text-primary);font-family:inherit}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:var(--accent-pink);box-shadow:0 0 0 3px #ff6b6b33}.form-group textarea{resize:vertical;min-height:120px}.submit-button{width:100%;padding:12px 24px;background:linear-gradient(135deg,var(--accent-pink) 0%,var(--accent-purple) 100%);color:var(--bg-primary);border:none;border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #ff6b6b4d}.submit-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #ff6b6b80}.footer{background:var(--bg-primary);color:var(--accent-pink);text-align:center;padding:30px 0;transition:background-color .3s;border-top:1px solid var(--border-color);text-shadow:0 0 5px rgba(255,107,107,.3)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@media(max-width:768px){.nav-menu{position:fixed;left:-100%;top:70px;flex-direction:column;background-color:var(--bg-secondary);width:100%;text-align:center;transition:.3s;box-shadow:0 10px 27px var(--shadow-color);padding:20px 0;border-top:1px solid var(--border-color);box-sizing:border-box;overflow-x:hidden}.nav-menu.active{left:0}.hamburger{display:flex}.hamburger.active span:nth-child(2){opacity:0}.hamburger.active span:nth-child(1){transform:translateY(8px) rotate(45deg)}.hamburger.active span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}.hero-title{font-size:2rem}.hero-subtitle{font-size:1rem}.about-content{grid-template-columns:1fr;gap:30px;text-align:center}.about-left{order:2}.about-right{order:1;align-items:center}.profile-image{max-width:220px;height:220px}.skills-achievements-container{grid-template-columns:1fr;gap:20px;align-items:start}.skills{height:auto}.achievements{max-width:100%;height:auto}.achievement-list{max-width:100%;margin:0 auto;flex:none;justify-content:flex-start;padding:0;width:100%}.skill-tags{display:flex;flex-wrap:wrap;justify-content:center;height:auto;align-content:flex-start}.skill-tag{height:auto;padding:8px 16px;min-height:auto}.timeline-container{padding-left:20px}.timeline-container:before{left:10px}.timeline-item{padding:15px;margin-bottom:20px}.timeline-item:before{left:-27px}.contact-content{grid-template-columns:1fr;gap:30px}.social-section{order:1}.contact-form{order:2}}@media(max-width:480px){.hero{padding:60px 0}.hero-title{font-size:1.5rem}.section-title{font-size:1.8rem}.about,.projects,.contact{padding:50px 0}.nav-container,.container{padding:0 15px}.contact-content{gap:20px}.social-section{padding:15px}.contact-form{padding:20px}.achievement-item{max-width:100%;padding:10px 12px;font-size:.85rem}.social-grid{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:15px;max-width:100%}.social-item{padding:15px}.social-icon{font-size:1.3rem}.social-item span:last-child{font-size:.85rem}}
