@font-face{font-family:SpecialFont;src:url(/assets/AlibabaPuHuiTi-3-55-Regular-CaTJ3M_Z.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}*{margin:0;padding:0;box-sizing:border-box}:root{--bg-color: #e6e9f0;--bg-light: #f0f2f7;--bg-dark: #d4d8e0;--text-color: #2c2c2c;--accent-color: #2563eb;--secondary-color: #6b7280;--hover-color: #1d4ed8;--shadow-light: rgba(255, 255, 255, .5);--shadow-dark: rgba(0, 0, 0, .15);--shadow-soft: 8px 8px 16px var(--shadow-dark), -3px -3px 6px var(--shadow-light);--shadow-soft-inset: inset 4px 4px 8px var(--shadow-dark), inset -2px -2px 4px var(--shadow-light);--shadow-soft-small: 4px 4px 8px var(--shadow-dark), -2px -2px 4px var(--shadow-light);--shadow-pressed: inset 2px 2px 4px var(--shadow-dark), inset -1px -1px 2px var(--shadow-light)}html,body{margin:0;height:100%}#app{height:100%;font-family:SpecialFont,-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;background:linear-gradient(135deg,var(--bg-color) 0%,var(--bg-light) 100%);color:var(--text-color);line-height:1.5}.main-layout{display:flex;gap:clamp(2rem,4vw,4rem);max-width:1400px;margin:0 auto;height:100%;align-items:center;justify-content:center}.left-content{width:100%;max-width:500px;text-align:center}.right-gallery{width:100%;max-width:500px;height:400px}.project-list{width:100%;display:flex;flex-direction:column;gap:16px}.project-card{background:#fff;border-radius:12px;box-shadow:var(--shadow-soft-small);transition:all .3s ease;display:flex;align-items:center;padding:16px;gap:16px}.project-card:hover{box-shadow:var(--shadow-soft);transform:translateY(-2px)}.project-card-empty{background:#f5f5f5;opacity:.7}.project-icon{flex-shrink:0;width:56px;height:56px;border-radius:12px;background:#fff;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-soft-small)}.project-icon img{width:100%;height:100%;object-fit:cover;border-radius:12px}.project-info{flex:1;display:flex;flex-direction:column;gap:6px;min-width:0}.project-header{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.project-title{font-size:16px;font-weight:600;color:var(--text-color);margin:0}.project-badge{font-size:12px;padding:4px 10px;background:#fef3c7;color:#92400e;border-radius:12px;font-weight:500;display:inline-flex;align-items:center;gap:4px}.project-developer{font-size:12px;color:var(--secondary-color);margin:0}.project-description{font-size:13px;color:var(--text-color);line-height:1.5;margin:0}.project-action{flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:8px}.install-link{font-size:11px;color:var(--secondary-color);text-decoration:none;transition:color .3s ease}.install-link:hover{color:var(--accent-color)}.drive-link{font-size:12px;color:var(--accent-color);text-decoration:none;transition:color .3s ease;white-space:nowrap}.drive-link:hover{color:var(--hover-color);text-decoration:underline}.get-button{padding:8px 20px;background:linear-gradient(135deg,var(--accent-color),#7c3aed);color:#fff;border:none;border-radius:8px;font-size:13px;font-weight:500;cursor:pointer;transition:all .3s ease;box-shadow:var(--shadow-soft-small);text-decoration:none;display:inline-block}.get-button:hover{box-shadow:var(--shadow-soft);transform:translateY(-1px)}.get-button:active{box-shadow:var(--shadow-pressed);transform:translateY(0)}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-content{background:#fff;border-radius:16px;box-shadow:var(--shadow-soft);max-width:500px;width:90%;max-height:80vh;overflow:hidden;display:flex;flex-direction:column}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid rgba(0,0,0,.1)}.modal-header h3{font-size:20px;font-weight:600;color:var(--text-color);margin:0}.modal-close{background:none;border:none;font-size:28px;color:var(--secondary-color);cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:8px;transition:all .3s ease}.modal-close:hover{background:var(--bg-light);color:var(--text-color)}.modal-body{padding:24px;overflow-y:auto}.install-steps{margin:0;padding-left:20px;list-style:decimal}.install-steps li{font-size:15px;color:var(--text-color);line-height:2;margin-bottom:12px}.install-steps li:last-child{margin-bottom:0}.gallery-label-text{font-size:12px;color:#fff;text-align:center;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}h1{font-size:clamp(1.8rem,5vw,2.5rem);margin-bottom:clamp(.1rem,.5vh,.3rem);background:linear-gradient(135deg,var(--accent-color),#7c3aed);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:700;animation:fadeInUp .8s ease-out;text-shadow:0 2px 4px rgba(0,0,0,.1);filter:drop-shadow(0 4px 8px rgba(37,99,235,.2))}.subtitle{font-size:clamp(.85rem,2vw,1rem);color:var(--secondary-color);margin-bottom:clamp(.2rem,.5vh,.4rem);animation:fadeInUp .8s ease-out .1s both}.tagline{font-size:clamp(.85rem,2vw,.95rem);color:var(--accent-color);margin-bottom:clamp(.2rem,.5vh,.4rem);font-weight:500;animation:fadeInUp .8s ease-out .2s both;display:inline-block;padding:.4rem 1rem}.base-info{font-size:clamp(.8rem,1.8vw,.9rem);color:var(--secondary-color);margin-bottom:clamp(.1rem,.3vh,.3rem);animation:fadeInUp .8s ease-out .3s both}.email-info{font-size:clamp(.8rem,1.8vw,.9rem);color:var(--secondary-color);margin-bottom:clamp(.8rem,2vh,1.5rem);animation:fadeInUp .8s ease-out .35s both}.email-info a{color:var(--accent-color);text-decoration:none;transition:all .3s ease;padding:.2rem .5rem;border-radius:8px;display:inline-block;position:relative}.email-info a:hover{color:var(--hover-color);background:#fff;box-shadow:var(--shadow-soft-small);text-decoration:none}.content{text-align:center;margin-bottom:clamp(.8rem,2vh,1.5rem);background:#fff;border-radius:20px;padding:clamp(1.2rem,3vh,1.8rem) clamp(1.5rem,4vw,2rem);box-shadow:var(--shadow-soft-small);margin-left:auto;margin-right:auto;max-width:90%}.content p{font-size:clamp(.9rem,2vw,1rem);color:var(--text-color);line-height:1.4;margin-bottom:clamp(.1rem,.3vh,.2rem);animation:fadeInUp .8s ease-out .4s both}.content p.en{color:var(--secondary-color);font-size:clamp(.8rem,1.8vw,.9rem);font-style:italic;margin-bottom:clamp(.4rem,1vh,.8rem);animation:fadeInUp .8s ease-out .5s both}.skills{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(.3rem,1vw,.5rem);margin:clamp(.4rem,1vh,.8rem) 0 clamp(.6rem,1.5vh,1.2rem) 0;animation:fadeInUp .8s ease-out .6s both}.skill-tag{background:#2563eb1a;color:var(--accent-color);padding:.3rem .8rem;border-radius:20px;font-size:.85rem;border:1px solid rgba(37,99,235,.2);transition:transform .2s ease,background .2s ease}.skill-tag:hover{transform:translateY(-2px);background:#2563eb26;border-color:#2563eb4d}.social-links{display:flex;justify-content:center;flex-wrap:wrap;gap:clamp(.8rem,2vw,1.2rem);margin-top:clamp(.8rem,2vh,1.5rem);animation:fadeInUp .8s ease-out .7s both}.social-link{display:flex;align-items:center;justify-content:center;width:56px;height:56px;text-decoration:none;transition:all .3s ease;background:#fff;border-radius:16px;box-shadow:var(--shadow-soft-small);position:relative}.social-link:hover{box-shadow:var(--shadow-soft);transform:translateY(-2px)}.social-link:active{box-shadow:var(--shadow-pressed);transform:translateY(0)}.social-link img{width:28px;height:28px;object-fit:contain;transition:all .3s ease;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1));position:relative;z-index:1}.social-link:hover img{transform:scale(1.1)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){html,body{height:auto;min-height:100%;margin:0;padding:0}#app{height:auto;min-height:100%;width:100%}.main-layout{flex-direction:column;gap:clamp(1.5rem,3vh,2rem);padding:clamp(2rem,4vh,3rem) clamp(.75rem,3vw,1rem) clamp(1rem,2vh,1.5rem);align-items:flex-start;height:auto;min-height:auto}.left-content{max-width:100%}.right-gallery{width:100%;max-width:100%;height:auto}.left-content{padding:0}.project-card{padding:12px;gap:12px}.project-icon{width:48px;height:48px;flex-shrink:0}.project-icon img{width:100%;height:100%;object-fit:cover;border-radius:12px}.project-info{min-width:0;flex:1}.project-title{font-size:14px}.project-description{font-size:12px;line-height:1.4}.project-action{flex-shrink:0;align-items:center}.get-button{padding:8px 16px;font-size:12px}.modal-content{width:95%;max-width:95%;margin:20px}.modal-header{padding:16px 20px}.modal-header h3{font-size:18px}.modal-body{padding:20px}.install-steps{padding-left:20px}.install-steps li{font-size:14px;line-height:1.8;margin-bottom:10px}}