*{margin:0;padding:0;box-sizing:border-box;font-family:'Microsoft YaHei',Arial,sans-serif}body{background-color:#f5f5f5;color:#333;min-height:100vh;display:flex;flex-direction:column}header{background-color:#7957a8;color:white;padding:15px 20px;display:flex;flex-direction:column;align-items:center;position:fixed;top:0;left:0;width:100%;z-index:1000;border-bottom:1px solid #6441A5}h1{font-size:1.5rem;font-weight:bold;margin:0 0 10px 0;text-align:center}nav{flex-grow:0;width:100%}nav ul{display:flex;list-style:none;flex-wrap:wrap;justify-content:center}nav li{padding:8px 15px;margin-left:5px;cursor:pointer;border-radius:4px}nav li a{color:white;text-decoration:none}nav li:hover,nav li.active{background-color:#8b6db4}main{flex:1;padding:20px;margin-top:110px}.content-area{padding:20px;min-height:400px}.upload-container{width:100%}.upload-container h2{color:#6b41a8;margin-bottom:20px;font-size:1.5rem}.upload-container h3{color:#6b41a8;margin:30px 0 15px;font-size:1.3rem}.file-buttons{display:flex;align-items:center;margin-bottom:20px}.file-btn{background-color:#88c9a1;color:white;border:none;padding:10px 15px;border-radius:4px;cursor:pointer;margin-right:15px}.file-btn:hover{background-color:#5bae77}.file-btn:disabled{background-color:#cccccc;cursor:not-allowed}#file-status{color:#666;margin-right:20px}.calculate-btn{background-color:#8046b9;color:white;border:none;padding:10px 15px;border-radius:4px;cursor:pointer}#exportBtn{margin-left:15px}.btn-export{background-color:#4CAF50;color:white;border:none;padding:10px 15px;border-radius:4px;cursor:pointer}.btn-export:hover{background-color:#3d8b40}.btn-export:disabled{background-color:#a5d6a7;color:white;opacity:0.7;cursor:not-allowed}.calculate-btn:hover{background-color:#6b3a9e}.calculate-btn:disabled{background-color:#cccccc;cursor:not-allowed}.result-container{margin-top:20px;padding:20px;background-color:#fff;border-radius:8px;border:1px solid #e0e0e0;overflow:auto;max-height:800px}#resultContainer{max-height:600px;overflow:hidden;border:1px solid #e0e0e0;border-radius:8px;padding:15px;margin-top:20px;background-color:#fff}.results-header{margin-bottom:20px;border-bottom:1px solid #e0e0e0;padding-bottom:10px}.results-header h2{font-size:1.6rem;color:#4a148c;margin-bottom:5px}.results-header p{color:#666;font-size:0.9rem}.result-container table{width:100%;border-collapse:collapse;margin-bottom:20px;font-size:0.9rem}.result-container th{background-color:#6a1b9a;color:white;font-weight:500;text-align:left;padding:12px 15px;position:sticky;top:0;z-index:10}.result-container td{padding:10px 15px;border-bottom:1px solid #e0e0e0;vertical-align:middle}.result-container tbody tr:hover{background-color:#f5f0fa}.quality-badge{display:inline-block;padding:4px 8px;border-radius:4px;font-weight:500;text-align:center;min-width:80px}.quality-excellent{background-color:#1b5e20;color:white}.quality-good{background-color:#2e7d32;color:white}.quality-fair{background-color:#ffa000;color:white}.quality-poor{background-color:#e64a19;color:white}.quality-very-poor{background-color:#c62828;color:white}.detail-button{background-color:#7b1fa2;color:white;border:none;border-radius:4px;padding:5px 10px;font-size:0.8rem;cursor:pointer}.detail-button:hover{background-color:#6a1b9a}.detail-row{background-color:#f9f4fc!important}.parameter-details{padding:15px}.parameter-details h4{margin-top:0;margin-bottom:10px;color:#4a148c}.detail-table{width:100%;border-collapse:collapse;font-size:0.85rem}.detail-table th{background-color:#9c27b0;color:white;font-weight:500;text-align:left;padding:8px 10px}.detail-table td{padding:6px 10px;border-bottom:1px solid #e0e0e0}.detail-table tbody tr:nth-child(even){background-color:#f3e5f5}.detail-table tbody tr:hover{background-color:#e1bee7}.export-section{margin-top:20px;text-align:right}.development-notice{text-align:center;padding:80px 20px}.development-notice h2{color:#6b41a8;font-size:2.2rem;margin-bottom:20px}.development-notice p{color:#666;font-size:1.4rem}.content-placeholder{min-height:400px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#999}footer{background-color:#6441A5;color:white;text-align:center;padding:15px;font-size:0.9rem;border-top:1px solid #8E5ECF}footer p{font-weight:500;letter-spacing:0.5px}.notice-box{margin:20px 0;width:90%;max-width:1200px;padding:15px 20px;background-color:#f9f4fc;border-radius:8px;border:1px solid #6b41a8;border-left:4px solid #6b41a8}.notice-text{font-size:1.2rem;color:#ff0000;font-weight:bold;text-align:left;margin:0}.error-container{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,0.5);display:flex;justify-content:center;align-items:center;z-index:1000;opacity:0;visibility:hidden}.error-container.show{opacity:1;visibility:visible}.error-box{background-color:white;border-radius:8px;border:1px solid #e0e0e0;width:90%;max-width:600px;padding:25px;position:relative;max-height:90vh;overflow-y:auto}.error-header{display:flex;align-items:center;margin-bottom:15px}.error-icon{background-color:#f44336;color:white;width:40px;height:40px;border-radius:50%;display:flex;justify-content:center;align-items:center;margin-right:15px;font-size:20px;font-weight:bold}.error-title{color:#f44336;font-size:1.3rem;font-weight:bold;flex-grow:1}.error-close{position:absolute;top:15px;right:15px;background:none;border:none;font-size:22px;cursor:pointer;color:#888}.error-close:hover{color:#333}.error-message{padding:10px 0;color:#555;font-size:1rem;line-height:1.5;white-space:pre-line;max-height:300px;overflow-y:auto;border:1px solid #eee;padding:10px;border-radius:4px}.error-button{background-color:#6b41a8;color:white;border:none;padding:10px 20px;border-radius:4px;cursor:pointer;margin-top:15px}.error-button:hover{background-color:#7e56b3}.matching-results{background-color:white;border-radius:8px;padding:2rem;margin-bottom:2rem;border:1px solid #e0e0e0}.matching-results h2{color:#6200ee;margin-bottom:1rem;font-size:1.5rem}.matching-results p{margin-bottom:1.5rem;color:#666}.matching-results table{width:100%;border-collapse:collapse;margin-bottom:1.5rem}.matching-results th{background-color:#f2e7fe;color:#6200ee;text-align:left;padding:0.8rem;border-bottom:2px solid #bb86fc}.matching-results td{padding:0.8rem;border-bottom:1px solid #e0e0e0}.matching-results tbody tr:hover{background-color:#f2e7fe}.match-status{font-weight:bold}.match-success{color:#4caf50}.match-error{color:#d32f2f}.matching-summary{background-color:#f2e7fe;padding:1rem;border-radius:6px;margin-top:1rem;border-left:4px solid #6200ee}.matching-summary p{margin:0.5rem 0;color:#333}.matching-warning{color:#ff9800;font-weight:bold}.results-container{background-color:white;border-radius:8px;padding:2rem;margin-bottom:2rem;border:1px solid #e0e0e0}.sheet-selection{margin:20px 0;padding:15px;background-color:#f9f4fc;border-radius:8px;border-left:4px solid #6b41a8}.sheet-selection h3{color:#6b41a8;margin-bottom:15px}.sheet-list{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:15px}.sheet-item{background-color:white;border:1px solid #e0e0e0;border-radius:4px;padding:8px 12px;display:flex;align-items:center}.sheet-item:hover{border-color:#6b41a8}.sheet-item input[type="checkbox"]{margin-right:8px}.sheet-actions{display:flex;gap:10px}.action-btn{background-color:#f2e7fe;color:#6b41a8;border:none;border-radius:4px;padding:6px 10px;cursor:pointer;font-size:0.9rem}.action-btn:hover{background-color:#e1bee7}.sheet-results{margin-bottom:30px;border-top:2px solid #6b41a8;padding-top:15px}.sheet-results h3{color:#6b41a8;margin-bottom:10px}.results-container h2{color:#6200ee;margin-bottom:1rem;font-size:1.5rem}.result-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:1px solid #e0e0e0}.results-table{width:100%;overflow-x:auto}.results-table table{width:100%;border-collapse:collapse}.results-table th{background-color:#f2e7fe;color:#6200ee;text-align:left;padding:0.8rem;border-bottom:2px solid #bb86fc}.results-table td{padding:0.8rem;border-bottom:1px solid #e0e0e0}.results-table tr:nth-child(even){background-color:#f9f9f9}.results-table tr:hover{background-color:#f2e7fe}.development-notice{background-color:#f2e7fe;border-radius:8px;padding:1.5rem;margin-bottom:2rem;border-left:4px solid #6200ee}.development-notice h3{color:#6200ee;margin-bottom:0.8rem}.development-notice ul{margin-left:1.5rem}@media (min-width:769px){header{flex-direction:row;justify-content:space-between;align-items:center;padding:15px 40px;height:80px}h1{margin:0;font-size:2rem;text-align:left;font-weight:700;letter-spacing:1px;position:relative;z-index:1;font-family:"Microsoft YaHei","黑体",Arial,sans-serif;color:white;padding:0 15px}nav{width:auto;display:flex;align-items:center;position:relative;z-index:1}nav ul{display:flex;gap:15px;margin-right:10px;background:rgba(255,255,255,0.08);padding:10px 15px;border-radius:8px}nav li{padding:8px 15px;margin-left:4px;border-radius:4px;font-weight:500;letter-spacing:0.5px}nav li:hover{background-color:rgba(255,255,255,0.2)}nav li.active{background-color:rgba(255,255,255,0.15);border-bottom:2px solid rgba(255,255,255,0.5)}nav li a{font-weight:500}main{margin-top:110px}}@media (max-width:768px){header{position:fixed;top:0;left:0;width:100%;padding:15px 10px}header h1{font-size:1.3rem;text-align:center;margin:0 0 15px 0;line-height:1.2;width:100%}header nav{width:100%}header nav ul{justify-content:center;flex-wrap:wrap;gap:5px}nav li{padding:5px 10px;margin:2px}main{margin-top:120px}upload-area{padding:1.5rem}.btn{width:100%;margin-bottom:0.5rem}.result-header{flex-direction:column;align-items:flex-start}.result-header div:first-child{margin-bottom:1rem}.file-buttons{flex-direction:column;align-items:stretch}#file-status{margin:10px 0;text-align:center}.calculate-btn,.file-btn{margin:5px 0;width:100%;text-align:center}#exportBtn{margin-left:0}.notice-box{width:100%;padding:10px 15px}.example-image-container{padding:10px}.results-flex-container{flex-direction:column;height:auto}.parameter-detail-panel{margin-top:15px;height:400px}.sheet-actions{flex-direction:column}.action-btn{width:100%;margin:5px 0}.example-image-wrapper{min-width:90%;max-width:100%}.responsive-image{max-width:100%;min-width:auto;width:100%}}@media (max-width:480px){header{padding:10px 5px}header h1{font-size:1.1rem;margin:0 0 10px 0;line-height:1.3}header nav{width:100%}nav li{padding:5px 8px;font-size:0.9rem;margin:2px}main{padding:15px 10px;margin-top:110px}content-area{padding:10px}.upload-container h2{font-size:1.3rem;text-align:center}.results-table{overflow-x:auto}.example-image-container h3{text-align:center}.example-images{flex-direction:column;gap:30px}.example-image-wrapper{min-width:100%;margin-bottom:0}.image-caption{font-size:0.85rem}.sheet-selection h3{font-size:1.1rem}.sheet-list{flex-direction:column;gap:5px}.example-image-container{padding:15px;margin:20px 0}.example-image-wrapper{min-width:100%}.responsive-image{min-width:auto;max-width:100%;width:100%}}@media (max-width:360px){header h1{font-size:1rem}nav li{padding:4px 6px;font-size:0.85rem;margin:2px}main{padding:10px 5px}upload-container h2{font-size:1.1rem}.example-image-container h3{font-size:1.1rem}.file-buttons{margin-bottom:15px}.file-btn,.calculate-btn{padding:8px 12px;font-size:0.9rem}.notice-box{margin:15px 0;font-size:0.9rem}.notice-box p{margin-bottom:6px}}.results-flex-container{display:flex;gap:20px;height:500px}.result-list{flex:3;overflow-y:auto;border:1px solid #e0e0e0;border-radius:4px;padding:10px}.parameter-detail-panel{flex:2;border:1px solid #e0e0e0;border-radius:4px;display:flex;flex-direction:column;overflow:hidden}.detail-panel-header{padding:10px 15px;background-color:#6b41a8;color:white;font-weight:500;border-top-left-radius:4px;border-top-right-radius:4px}.detail-panel-content{flex:1;overflow-y:auto;padding:15px}.summary-section{margin-bottom:20px;padding:15px;background-color:#f5f0fa;border-radius:6px;display:flex;justify-content:space-between}.wqi-score,.wqi-level{font-size:1.1rem;padding:5px 10px}.score-value{font-weight:bold;color:#6b41a8}.level-value{font-weight:bold;color:#6b41a8}.warning-messages{margin:15px 0;padding:10px;background-color:#fff8e1;border-left:4px solid #ffc107;border-radius:4px}.warning-messages ul{margin-top:5px;margin-left:20px}.detail-placeholder{display:flex;height:100%;align-items:center;justify-content:center;color:#888;text-align:center;padding:20px}.row-selected{background-color:#e1bee7!important}.example-image-container{margin:40px 0;padding:20px;background-color:white;border-radius:8px;border:1px solid #e0e0e0;border-top:2px solid #6b41a8;max-width:100%;width:100%;margin-left:0;margin-right:0;box-sizing:border-box;display:flex;flex-direction:column;align-items:center}.example-image-container h3{color:#6b41a8;margin-bottom:10px;font-size:1.3rem}.example-description{color:#666;margin-bottom:15px;font-size:0.95rem;text-align:left}.example-images{display:flex;flex-wrap:wrap;justify-content:center;gap:20px;width:95%;margin:0 auto}.example-image-wrapper{flex:1;min-width:400px;max-width:1200px;border:1px solid #e0e0e0;margin:10px;position:relative}.responsive-image{width:100%;max-width:100%;border:1px solid #e0e0e0;border-radius:4px}.image-caption{margin-top:10px;color:#666;font-size:0.9rem;font-style:italic}.loading-indicator{position:fixed;top:0;left:0;right:0;height:3px;width:100%;background-color:#7957a8;z-index:1500;display:none}.body.loading .loading-indicator{display:block}