*{margin:0;padding:0;box-sizing:border-box}body{font-family:Arial,sans-serif;background:#f8f9fa;color:#333;line-height:1.6;position:relative;min-height:100vh}#app{position:relative;padding:0}nav{display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);position:sticky;top:0;z-index:10;box-shadow:0 2px 10px #0000001a}.logo{font-size:1.5rem;font-weight:700;color:#007bff}.nav-links{display:flex;gap:1.5rem}.nav-links a{color:#666;text-decoration:none;padding:.5rem .8rem;border-radius:4px;transition:all .3s ease;position:relative}.nav-links a:hover,.nav-links a.active{color:#007bff}.nav-links a.active:after{content:"";position:absolute;bottom:-5px;left:0;width:100%;height:2px;background:#007bff;animation:glow 2s ease-in-out infinite alternate}.nav-emoji{margin-left:5px;font-size:1.2rem}.hamburger{display:none;cursor:pointer}.bar{width:25px;height:3px;background:#007bff;margin:5px 0;transition:all .3s ease}header{text-align:center;padding:4rem 2rem}h1{font-size:3.5rem;margin-bottom:1rem;color:#007bff;text-shadow:0 0 10px rgba(0,123,255,.3);animation:glow 2s ease-in-out infinite alternate}@keyframes glow{0%{text-shadow:0 0 10px rgba(0,123,255,.3)}to{text-shadow:0 0 20px rgba(0,123,255,.5)}}.subtitle{font-size:1.5rem;color:#666}.tool-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;padding:2rem;max-width:1200px;margin:0 auto}.card{background:#fff;padding:2rem;border-radius:10px;box-shadow:0 4px 6px #0000001a;transition:all .3s ease;border:1px solid #e9ecef;cursor:pointer}.card:hover{transform:translateY(-5px);box-shadow:0 8px 12px #007bff33;border-color:#007bff}.emoji{font-size:2.5rem;margin-bottom:1rem;display:inline-block}.card .emoji{animation:float 3s ease-in-out infinite}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-10px)}to{transform:translateY(0)}}footer{position:fixed;bottom:0;width:100%;padding:1rem;background:#fffffff2;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);text-align:center;border-top:1px solid #e9ecef}.friend-links{display:flex;justify-content:center;align-items:center;gap:.5rem;margin-bottom:1rem;padding-bottom:1rem;border-bottom:1px solid #e9ecef}.friend-links-title{color:#666;font-size:.9rem}.friend-links a{color:#007bff;text-decoration:none;font-size:.9rem;transition:all .3s ease}.friend-links a:hover{color:#0056b3;text-decoration:underline}.beian-info{display:flex;justify-content:center;align-items:center;gap:1rem;font-size:.9rem;flex-wrap:wrap}.beian-icon{height:20px;margin-right:5px}.separator{color:#666}a{color:#666;text-decoration:none;transition:color .3s ease}a:hover{color:#007bff}@media (max-width: 768px){h1{font-size:2.5rem}.subtitle{font-size:1.2rem}.tool-cards{padding:1rem}.hamburger{display:block}.nav-links{position:fixed;top:70px;left:-100%;flex-direction:column;background:#fffffff2;width:100%;padding:1rem;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.nav-links.active{left:0}}@media (max-width: 480px){.beian-info{flex-direction:column;gap:.5rem}.separator{display:none}footer{padding:.8rem}}