:root{--primary-color: #0d6efd;--secondary-color: #6c757d;--success-color: #198754;--warning-color: #ffc107;--danger-color: #dc3545;--light-bg: #f8f9fa;--border-color: #e9ecef;--card-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075);--card-shadow-hover: 0 .5rem 1rem rgba(0, 0, 0, .15)}body{background:linear-gradient(135deg,#f5f7fa,#c3cfe2);font-family:Microsoft YaHei,sans-serif;min-height:100vh;padding:20px 0}.container{max-width:1400px;margin:0 auto;padding:30px;background-color:#fff;border-radius:16px;box-shadow:var(--card-shadow-hover)}.page-title{text-align:center;color:var(--primary-color);margin-bottom:30px;padding-bottom:20px;border-bottom:3px solid var(--light-bg);font-size:2.2rem;font-weight:700;background:linear-gradient(45deg,var(--primary-color),#0a58ca);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 2px 4px rgba(0,0,0,.1)}.file-upload-section{margin-bottom:30px;padding:25px;background-color:#fff;border-radius:12px;box-shadow:var(--card-shadow);transition:all .3s ease;border:1px solid var(--border-color)}.file-upload-section:hover{box-shadow:var(--card-shadow-hover);transform:translateY(-2px)}.file-upload-section h4{color:var(--primary-color);margin-bottom:20px;display:flex;align-items:center;font-weight:600;font-size:1.2rem}.file-upload-section h4 i{margin-right:10px}.file-upload-area{border:2px dashed var(--primary-color);border-radius:10px;padding:50px 20px;text-align:center;margin-bottom:15px;cursor:pointer;transition:all .3s ease;-webkit-user-select:none;user-select:none;background:linear-gradient(135deg,#0d6efd08,#0d6efd03)}.file-upload-area:hover{border-color:#0a58ca;background:linear-gradient(135deg,#0d6efd14,#0d6efd0a);transform:scale(1.01)}.file-upload-area:active{transform:scale(.99);background:linear-gradient(135deg,#0d6efd1f,#0d6efd0f)}.file-type-label{display:inline-block;padding:6px 12px;background-color:var(--primary-color);color:#fff;border-radius:20px;font-size:12px;font-weight:500;margin-left:10px;box-shadow:0 2px 4px #0000001a;transition:all .3s ease}.file-type-label:hover{transform:translateY(-1px);box-shadow:0 4px 8px #00000026}.file-type-label.control{background-color:var(--warning-color)}.file-type-label.data{background-color:var(--success-color)}.uploaded-file-name{margin:15px 0;padding:12px 16px;background:linear-gradient(135deg,#0d6efd1a,#0d6efd0d);border-radius:8px;font-size:14px;color:var(--primary-color);font-weight:500;display:flex;align-items:center;justify-content:space-between;border:1px solid rgba(13,110,253,.2);transition:all .3s ease}.uploaded-file-name:hover{background:linear-gradient(135deg,#0d6efd26,#0d6efd14);border-color:#0d6efd4d}.uploaded-file-name span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-right:10px}.encoding-selector{margin:15px 0;padding:20px;background-color:#fff;border-radius:10px;border:1px solid var(--border-color);box-shadow:var(--card-shadow);transition:all .3s ease}.encoding-selector:hover{box-shadow:var(--card-shadow-hover)}.encoding-preview{margin-top:15px;padding:15px;background-color:#f8f9fa;border-radius:8px;font-size:12px;max-height:120px;overflow-y:auto;border:1px solid #dee2e6;white-space:pre-wrap;word-break:break-all;transition:all .3s ease}.encoding-preview:hover{background-color:#e9ecef}.encoding-result{margin:12px 0;padding:10px 15px;background:linear-gradient(135deg,#1987541a,#1987540d);border-radius:6px;border-left:4px solid var(--success-color);font-size:14px;color:var(--success-color);font-weight:500;transition:all .3s ease}.encoding-result:hover{background:linear-gradient(135deg,#19875426,#19875414)}.time-select-dropdown{margin:15px 0;padding:20px;background-color:#fff;border-radius:10px;border:1px solid var(--border-color);box-shadow:var(--card-shadow);transition:all .3s ease}.time-select-dropdown:hover{box-shadow:var(--card-shadow-hover)}.time-select-dropdown select{width:100%;padding:12px 16px;border-radius:8px;border:1px solid var(--border-color);font-size:14px;transition:all .3s ease;box-shadow:var(--card-shadow)}.time-select-dropdown select:hover{border-color:var(--primary-color);box-shadow:var(--card-shadow-hover)}.time-select-dropdown select:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #0d6efd40}.data-count-hint{font-size:14px;color:var(--secondary-color);margin-bottom:15px;padding:10px 15px;background:linear-gradient(135deg,#0d6efd0d,#0d6efd05);border-radius:8px;text-align:center;border:1px solid rgba(13,110,253,.15);font-weight:500}.table-container{max-height:500px;overflow-y:auto;margin-top:20px;margin-bottom:30px;border:1px solid var(--border-color);border-radius:12px;box-shadow:var(--card-shadow);transition:all .3s ease}.table-container:hover{box-shadow:var(--card-shadow-hover)}.table{margin-bottom:0;border-collapse:separate;border-spacing:0}.table th{position:sticky;top:0;background:linear-gradient(135deg,var(--primary-color) 0%,#0a58ca 100%);color:#fff;border:1px solid var(--primary-color);padding:12px 16px;font-weight:600;text-align:left;z-index:10}.table td{border:1px solid var(--border-color);padding:10px 16px;vertical-align:middle;transition:all .2s ease}.table tr:hover td{background-color:#0d6efd0d}.axis-selector{margin-bottom:30px;padding:25px;background-color:#fff;border-radius:12px;box-shadow:var(--card-shadow);transition:all .3s ease;border:1px solid var(--border-color)}.axis-selector:hover{box-shadow:var(--card-shadow-hover)}.axis-selector h4{color:var(--primary-color);margin-bottom:25px;font-weight:600;font-size:1.3rem;text-align:center;background:linear-gradient(45deg,var(--primary-color),#0a58ca);-webkit-background-clip:text;background-clip:text;color:transparent}.multi-select{height:140px;transition:all .3s ease;box-shadow:var(--card-shadow);border-radius:8px}.multi-select:hover{box-shadow:var(--card-shadow-hover);border-color:var(--primary-color)}.multi-select:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #0d6efd40}.chart-container{max-width:100%;height:550px;margin-top:30px;border:1px solid var(--border-color);border-radius:12px;padding:20px;background-color:#fff;box-shadow:var(--card-shadow);transition:all .3s ease}.chart-container:hover{box-shadow:var(--card-shadow-hover)}.btn-area{margin:30px 0;text-align:center;display:flex;justify-content:center;gap:15px;flex-wrap:wrap}.btn-area button{transition:all .3s ease;box-shadow:var(--card-shadow);font-weight:500;padding:10px 24px;font-size:15px}.btn-area button:hover{transform:translateY(-2px);box-shadow:var(--card-shadow-hover)}.status-text{margin:20px 0;font-size:15px;padding:15px 20px;border-radius:10px;background:linear-gradient(135deg,#0d6efd0d,#0d6efd05);border:1px solid rgba(13,110,253,.15);font-weight:500;box-shadow:var(--card-shadow)}.help-text{font-size:13px;color:var(--secondary-color);margin-top:10px;font-style:italic;opacity:.8}.table-controls{margin:20px 0;background-color:#fff;padding:15px 20px;border-radius:10px;box-shadow:var(--card-shadow);border:1px solid var(--border-color)}.pagination-controls{display:flex;align-items:center;gap:10px}.pagination-controls button{transition:all .3s ease;box-shadow:var(--card-shadow)}.pagination-controls button:hover{transform:translateY(-1px);box-shadow:var(--card-shadow-hover)}#pageInput{width:80px;text-align:center;transition:all .3s ease;box-shadow:var(--card-shadow)}#pageInput:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #0d6efd40;width:100px}
