*{margin:0;padding:0;box-sizing:border-box}body{font-family:'Microsoft YaHei',Arial,sans-serif;line-height:1.6;color:#333;background-color:#f5f5f5;padding:0}header{background-color:#2c3e50;color:#fff;padding:0 0;text-align:center;margin-bottom:10px;border-radius:0}header h1{margin-bottom:15px}nav ul{list-style:none;display:flex;justify-content:center;flex-wrap:wrap}nav li{margin:0 1px}nav a{color:#fff;text-decoration:none;padding:5px 10px;border-radius:3px;transition:background-color .3s}nav a:hover{background-color:#34495e}main{background-color:#fff;padding:20px;border-radius:5px;box-shadow:0 2px 5px rgba(0,0,0,.1);margin-bottom:20px}.tool-category,.welcome,.error{padding:20px}.tool-category h2,.welcome h2,.error h2{color:#2c3e50;margin-bottom:15px;padding-bottom:10px;border-bottom:1px solid #eee}footer{text-align:center;padding:10px;color:#333;font-size:.9em}@media (max-width:768px){nav ul{flex-direction:column;align-items:center}nav li{margin:5px 0}}.tool-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:6px;margin-top:20px}.tool-item{display:block;padding:6px;background:#fff;border:1px solid #ddd;border-radius:4px;text-align:center;color:#333;text-decoration:none;transition:all .3s}.tool-item:hover{background:#3498db;color:#fff;transform:translateY(-2px);box-shadow:0 2px 5px rgba(0,0,0,.1)}.dropdown{position:relative;display:inline-block}.dropdown-content{display:none;position:absolute;background-color:#f9f9f9;min-width:1000px;box-shadow:0 8px 16px 0 rgba(0,0,0,.2);z-index:1;padding:15px;left:calc(10% - 30px);transform:translateX(-10%);border-radius:4px}.dropdown-content::before{content:"";position:absolute;top:-10px;left:50%;transform:translateX(-50%);border-width:0 10px 10px;border-style:solid;border-color:transparent transparent #f9f9f9 transparent}.dropdown-content .tool-grid{text-decoration:none;display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.dropdown-content a{color:#333;padding:8px 12px;text-decoration:none;display:block;white-space:nowrap;border-radius:3px;transition:all .2s}.dropdown-content a:hover{background-color:#3498db;color:#fff}.dropdown:hover .dropdown-content{display:block}.dropdown-icon{font-size:.8em;margin-left:0}@media (max-width:1200px){.dropdown-content{min-width:800px}.dropdown-content .tool-grid{grid-template-columns:repeat(4,1fr)}}@media (max-width:992px){.dropdown-content{min-width:600px}.dropdown-content .tool-grid{grid-template-columns:repeat(3,1fr)}}@media (max-width:768px){.dropdown-content{min-width:400px}.dropdown-content .tool-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:576px){.dropdown-content{min-width:300px}.dropdown-content .tool-grid{grid-template-columns:1fr}}.copy-part-btn{margin:5px 0;padding:3px 10px;background:#4caf50;color:#fff;border:none;border-radius:3px;cursor:pointer;float:right}.code-part textarea{clear:both;width:100%;margin-top:5px}.copy-part-btn{margin:5px 0;padding:3px 10px;background:#4caf50;color:#fff;border:none;border-radius:3px;cursor:pointer;float:right}.code-part textarea{clear:both;width:100%;margin-top:5px}.option-group{margin-bottom:15px}.option-group label{display:block;margin-bottom:5px;font-weight:bold;color:#333}.option-group input[type="text"],.option-group input[type="number"]{width:100%;padding:8px 12px;border:1px solid #ddd;border-radius:4px;font-size:14px;transition:border-color .3s}.option-group input[type="text"]:focus,.option-group input[type="number"]:focus{border-color:#4caf50;outline:none;box-shadow:0 0 0 2px rgba(76,175,80,.2)}.option-group input[type="text"]::placeholder,.option-group input[type="number"]::placeholder{color:#999}.encrypt{position:relative;display:inline-block}.encrypt-content{display:none;position:absolute;background-color:#f9f9f9;min-width:1000px;box-shadow:0 8px 16px 0 rgba(0,0,0,.2);z-index:1;padding:15px;left:calc(10% - 30px);transform:translateX(-10%);border-radius:4px}.encrypt-content::before{content:"";position:absolute;top:-10px;left:50%;transform:translateX(-50%);border-width:0 10px 10px;border-style:solid;border-color:transparent transparent #f9f9f9 transparent}.encrypt-content .tool-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.encrypt-content a{color:#333;padding:8px 12px;text-decoration:none;display:block;white-space:nowrap;border-radius:3px;transition:all .2s}.encrypt-content a:hover{background-color:#3498db;color:#fff}.encrypt:hover .encrypt-content{display:block}.encrypt-icon{font-size:.8em;margin-left:0}.encode{position:relative;display:inline-block}.encode-content{display:none;position:absolute;background-color:#f9f9f9;min-width:1000px;box-shadow:0 8px 16px 0 rgba(0,0,0,.2);z-index:1;padding:15px;left:calc(10% - 30px);transform:translateX(-10%);border-radius:4px}.encode-content::before{content:"";position:absolute;top:-10px;left:50%;transform:translateX(-50%);border-width:0 10px 10px;border-style:solid;border-color:transparent transparent #f9f9f9 transparent}.encode-content .tool-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.encode-content a{color:#333;padding:8px 12px;text-decoration:none;display:block;white-space:nowrap;border-radius:3px;transition:all .2s}.encode-content a:hover{background-color:#3498db;color:#fff}.encode:hover .encode-content{display:block}.encode-icon{font-size:.8em;margin-left:0}.seo{position:relative;display:inline-block}.seo-content{display:none;position:absolute;background-color:#f9f9f9;min-width:1000px;box-shadow:0 8px 16px 0 rgba(0,0,0,.2);z-index:1;padding:15px;left:calc(10% - 30px);transform:translateX(-10%);border-radius:4px}.seo-content::before{content:"";position:absolute;top:-10px;left:50%;transform:translateX(-50%);border-width:0 10px 10px;border-style:solid;border-color:transparent transparent #f9f9f9 transparent}.seo-content .tool-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.seo-content a{color:#333;padding:8px 12px;text-decoration:none;display:block;white-space:nowrap;border-radius:3px;transition:all .2s}.seo-content a:hover{background-color:#3498db;color:#fff}.seo:hover .seo-content{display:block}.seo-icon{font-size:.8em;margin-left:0}.format{position:relative;display:inline-block}.format-content{display:none;position:absolute;background-color:#f9f9f9;min-width:1000px;box-shadow:0 8px 16px 0 rgba(0,0,0,.2);z-index:1;padding:15px;left:calc(10% - 300px);transform:translateX(-10%);border-radius:4px}.format-content::before{content:"";position:absolute;top:-10px;left:50%;transform:translateX(-50%);border-width:0 10px 10px;border-style:solid;border-color:transparent transparent #f9f9f9 transparent}.format-content .tool-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.format-content a{color:#333;padding:8px 12px;text-decoration:none;display:block;white-space:nowrap;border-radius:3px;transition:all .2s}.format-content a:hover{background-color:#3498db;color:#fff}.format:hover .format-content{display:block}.format-icon{font-size:.8em;margin-left:0}.convert{position:relative;display:inline-block}.convert-content{display:none;position:absolute;background-color:#f9f9f9;min-width:1000px;box-shadow:0 8px 16px 0 rgba(0,0,0,.2);z-index:1;padding:15px;left:calc(10% - 400px);transform:translateX(-10%);border-radius:4px}.convert-content::before{content:"";position:absolute;top:-10px;left:50%;transform:translateX(-50%);border-width:0 10px 10px;border-style:solid;border-color:transparent transparent #f9f9f9 transparent}.convert-content .tool-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.convert-content a{color:#333;padding:8px 12px;text-decoration:none;display:block;white-space:nowrap;border-radius:3px;transition:all .2s}.convert-content a:hover{background-color:#3498db;color:#fff}.convert:hover .convert-content{display:block}.convert-icon{font-size:.8em;margin-left:0}.network{position:relative;display:inline-block}.network-content{display:none;position:absolute;background-color:#f9f9f9;min-width:1000px;box-shadow:0 8px 16px 0 rgba(0,0,0,.2);z-index:1;padding:15px;left:calc(10% - 300px);transform:translateX(-10%);border-radius:4px}.network-content::before{content:"";position:absolute;top:-10px;left:50%;transform:translateX(-50%);border-width:0 10px 10px;border-style:solid;border-color:transparent transparent #f9f9f9 transparent}.network-content .tool-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.network-content a{color:#333;padding:8px 12px;text-decoration:none;display:block;white-space:nowrap;border-radius:3px;transition:all .2s}.network-content a:hover{background-color:#3498db;color:#fff}.network:hover .network-content{display:block}.network-icon{font-size:.8em;margin-left:0}.picture{position:relative;display:inline-block}.picture-content{display:none;position:absolute;background-color:#f9f9f9;min-width:1000px;box-shadow:0 8px 16px 0 rgba(0,0,0,.2);z-index:1;padding:15px;left:calc(10% - 300px);transform:translateX(-10%);border-radius:4px}.picture-content::before{content:"";position:absolute;top:-10px;left:50%;transform:translateX(-50%);border-width:0 10px 10px;border-style:solid;border-color:transparent transparent #f9f9f9 transparent}.picture-content .tool-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.picture-content a{color:#333;padding:8px 12px;text-decoration:none;display:block;white-space:nowrap;border-radius:3px;transition:all .2s}.picture-content a:hover{background-color:#3498db;color:#fff}.picture:hover .picture-content{display:block}.picture-icon{font-size:.8em;margin-left:0}.text{position:relative;display:inline-block}.text-content{display:none;position:absolute;background-color:#f9f9f9;min-width:1000px;box-shadow:0 8px 16px 0 rgba(0,0,0,.2);z-index:1;padding:15px;left:calc(10% - 400px);transform:translateX(-10%);border-radius:4px}.text-content::before{content:"";position:absolute;top:-10px;left:50%;transform:translateX(-50%);border-width:0 10px 10px;border-style:solid;border-color:transparent transparent #f9f9f9 transparent}.text-content .tool-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.text-content a{color:#333;padding:8px 12px;text-decoration:none;display:block;white-space:nowrap;border-radius:3px;transition:all .2s}.text-content a:hover{background-color:#3498db;color:#fff}.text:hover .text-content{display:block}.text-icon{font-size:.8em;margin-left:0}.calculate{position:relative;display:inline-block}.calculate-content{display:none;position:absolute;background-color:#f9f9f9;min-width:1000px;box-shadow:0 8px 16px 0 rgba(0,0,0,.2);z-index:1;padding:15px;left:calc(10% - 500px);transform:translateX(-10%);border-radius:4px}.calculate-content::before{content:"";position:absolute;top:-10px;left:50%;transform:translateX(-50%);border-width:0 10px 10px;border-style:solid;border-color:transparent transparent #f9f9f9 transparent}.calculate-content .tool-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.calculate-content a{color:#333;padding:8px 12px;text-decoration:none;display:block;white-space:nowrap;border-radius:3px;transition:all .2s}.calculate-content a:hover{background-color:#3498db;color:#fff}.calculate:hover .calculate-content{display:block}.calculate-icon{font-size:.8em;margin-left:0}.encrypt-content::before,.encode-content::before,.seo-content::before,.format-content::before,.convert-content::before,.network-content::before,.picture-content::before,.text-content::before,.calculate-content::before{display:none}a{text-decoration:none}