*{margin:0;padding:0;box-sizing:border-box;font-family:'Segoe UI','Microsoft YaHei',sans-serif}
        body{min-height:100vh;display:flex;flex-direction:column;background:linear-gradient(135deg,#e6f0ff,#f0f7ff,#e6f0ff);color:#333;overflow-x:hidden;position:relative}
        .animated-background{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;overflow:hidden}
        .shape{position:absolute;opacity:0.4;animation:float 15s infinite ease-in-out}
        .bubble{position:absolute;border-radius:50%;background:rgba(79,156,238,0.12);opacity:0.6;animation:float 15s infinite ease-in-out;filter:blur(1px)}
        .triangle{width:0;height:0;border-left:25px solid transparent;border-right:25px solid transparent;border-bottom:50px solid rgba(79,156,238,0.15);animation:rotate 30s infinite linear}
        .square{width:60px;height:60px;background:rgba(79,156,238,0.1);animation:rotate 25s infinite linear reverse}
        .ellipse{width:80px;height:40px;background:rgba(79,156,238,0.12);border-radius:50%;animation:pulse 8s infinite ease-in-out}
        .concentric-circle{width:100px;height:100px;border:3px solid rgba(79,156,238,0.15);border-radius:50%;position:relative;animation:ripple 4s infinite ease-out}
        .concentric-circle::before,.concentric-circle::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border-radius:50%}
        .concentric-circle::before{width:60px;height:60px;border:2px solid rgba(79,156,238,0.1)}
        .concentric-circle::after{width:30px;height:30px;background:rgba(79,156,238,0.05)}
        .pentagon{width:54px;height:50px;background:rgba(79,156,238,0.1);clip-path:polygon(50% 0%,100% 38%,82% 100%,18% 100%,0% 38%);animation:rotate 28s infinite linear}
        .hexagon{width:100px;height:86.6px;clip-path:polygon(25% 0%,75% 0%,100% 50%,75% 100%,25% 100%,0% 50%);background:rgba(79,156,238,0.2);animation:float 40s infinite}
        .straight-line{position:absolute;height:2px;background:rgba(79,156,238,0.1);animation:flow 20s infinite linear;transform-origin:left center}
        .star{width:60px;height:60px;background:rgba(79,156,238,0.1);clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);animation:pulse 6s infinite ease-in-out}
        @keyframes float{0%{transform:translate(0,0) rotate(0)}25%{transform:translate(-30px,-40px) rotate(-10deg)}50%{transform:translate(25px,30px) rotate(8deg)}75%{transform:translate(35px,-25px) rotate(-5deg)}100%{transform:translate(0,0) rotate(0)}}
        @keyframes rotate{100%{transform:rotate(360deg)}}
        @keyframes flow{0%{transform:scaleX(0) translateX(0)}50%{transform:scaleX(1) translateX(50px)}100%{transform:scaleX(0) translateX(100px)}}
        @keyframes pulse{0%,100%{transform:scale(1);opacity:0.3}50%{transform:scale(1.1);opacity:0.5}}
        @keyframes ripple{100%{transform:scale(1.5);opacity:0}}
        @keyframes gentle-rotate{0%{transform:translate(0,0) rotate(0)}25%{transform:translate(-30px,-40px) rotate(5deg)}50%{transform:translate(25px,30px) rotate(-3deg)}75%{transform:translate(35px,-25px) rotate(2deg)}100%{transform:translate(0,0) rotate(0)}}
        @keyframes gentle-rotate-reverse{0%{transform:translate(0,0) rotate(0)}25%{transform:translate(-30px,-40px) rotate(-5deg)}50%{transform:translate(25px,30px) rotate(3deg)}75%{transform:translate(35px,-25px) rotate(-2deg)}100%{transform:translate(0,0) rotate(0)}}
        .container{max-width:1200px;margin:0 auto;padding:20px;flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}
        .welcome-header{margin-bottom:50px;animation:fadeIn 1.5s ease-out;z-index:10;position:relative;background:rgba(255,255,255,0.7);padding:30px;border-radius:20px;box-shadow:0 10px 30px rgba(0,0,0,0.05);backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,0.5)}
        .welcome-header h1{font-size:2.8rem;font-weight:600;color:#2c3e50;margin-bottom:15px;letter-spacing:1px;text-shadow:0 2px 4px rgba(0,0,0,0.1)}
        .welcome-header p{font-size:1.2rem;color:#4F9CEE;max-width:700px;line-height:1.6;margin-top:10px}
        .links-container{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;width:100%;max-width:900px;margin-bottom:50px;z-index:10;position:relative}
        .nav-link{background:rgba(255,255,255,0.85);border-radius:12px;padding:25px 15px;text-decoration:none;color:#2c3e50;font-weight:500;font-size:1.1rem;transition:all .3s ease;box-shadow:0 5px 15px rgba(0,0,0,0.05);display:flex;flex-direction:column;align-items:center;backdrop-filter:blur(5px);border:1px solid rgba(79,156,238,0.1);position:relative;overflow:hidden}
        .nav-link::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(79,156,238,0.05);opacity:0;transition:opacity .3s ease}
        .nav-link i{font-size:2.2rem;margin-bottom:15px;color:#4F9CEE;transition:all .3s ease}
        .nav-link:hover{transform:translateY(-5px);box-shadow:0 8px 25px rgba(79,156,238,0.25);background:rgba(255,255,255,0.95)}
        .nav-link:hover::before{opacity:1}
        .nav-link:hover i{transform:scale(1.1)}
        .highlight{background:linear-gradient(135deg,#4F9CEE,#6baef5);color:#fff!important;grid-column:span 2}
        .highlight i{color:#fff!important}
        .highlight:hover{background:linear-gradient(135deg,#3e8bd8,#5a9be9)}
        .search-form-container{background:rgba(255,255,255,0.85);border-radius:12px;padding:20px;display:flex;align-items:center;box-shadow:0 5px 15px rgba(0,0,0,0.05);backdrop-filter:blur(5px);border:1px solid rgba(79,156,238,0.1);grid-column:span 2;transition:all .3s ease}
        .search-form-container:hover{transform:translateY(-5px);box-shadow:0 8px 25px rgba(79,156,238,0.25);background:rgba(255,255,255,0.95)}
        .search-icon{font-size:1.5rem;color:#4F9CEE;margin-right:15px;flex-shrink:0}
        .search-form-all{display:flex;flex-grow:1}
        .search-input-group{display:flex;width:100%;background:rgba(255,255,255,0.9);border-radius:8px;overflow:hidden;border:1px solid rgba(79,156,238,0.2);transition:all .3s ease}
        .search-input-group:focus-within{box-shadow:0 0 0 3px rgba(79,156,238,0.2);border-color:#4F9CEE}
        .search-input{flex-grow:1;border:none;padding:12px 15px;font-size:1rem;background:transparent;outline:none;color:#2c3e50}
        .search-input::placeholder{color:#a0aec0}
        .search-button{background:#4F9CEE;border:none;color:#fff;padding:0 15px;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center}
        .search-button:hover{background:#3e8bd8}
        footer{background:rgba(255,255,255,0.2);padding:20px;text-align:center;font-size:.9rem;color:#666;border-top:1px solid rgba(0,0,0,0.05);backdrop-filter:blur(5px);z-index:10;position:relative}
        footer a{color:inherit;text-decoration:none;cursor:default}
        .separator{margin:0 10px;color:#bbb}
        @keyframes fadeIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
        @media screen and (max-width:768px){
            .welcome-header h1{font-size:2rem;padding:0 10px}
            .welcome-header p{font-size:1rem}
            .links-container{grid-template-columns:1fr;gap:15px;max-width:500px}
            .highlight,.search-form-container{grid-column:span 1}
            .nav-link{padding:20px 15px;font-size:1rem}
            .nav-link i{font-size:1.8rem}
            .welcome-header{padding:20px;margin:0 15px 30px}
            .search-form-container{padding:15px;flex-direction:column;text-align:center}
            .search-icon{margin-right:0;margin-bottom:10px}
            footer p{display:flex;flex-direction:column;gap:5px}
            .separator{display:none}
        }