.page-title[data-v-b75ffaca]{position:relative;padding-left:15px;margin-bottom:25px;color:#2c3e50;font-weight:700}.page-title[data-v-b75ffaca]:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:4px;height:20px;background-color:var(--el-color-primary);border-radius:2px;transition:height .3s ease}.page-title[data-v-b75ffaca]:hover:before{height:30px}.app-header .header-nav .nav-link[data-v-b75ffaca]{position:relative;overflow:hidden}.app-header .header-nav .nav-link[data-v-b75ffaca]:after{content:"";position:absolute;bottom:0;left:50%;width:0;height:2px;background-color:var(--el-color-primary);transition:all .3s ease;transform:translateX(-50%)}.app-header .header-nav .nav-link[data-v-b75ffaca]:hover:after{width:80%}.app-footer .footer-content[data-v-b75ffaca]{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap}@media(max-width:768px){.app-footer .footer-content[data-v-b75ffaca]{flex-direction:column;gap:10px}}.app-footer .copyright[data-v-b75ffaca]{margin:0}.app-footer .footer-links[data-v-b75ffaca]{display:flex;align-items:center}.app-footer .footer-links .footer-link[data-v-b75ffaca]{color:var(--el-text-color-secondary);text-decoration:none;transition:color .3s}.app-footer .footer-links .footer-link[data-v-b75ffaca]:hover{color:var(--el-color-primary)}.app-footer .footer-links .separator[data-v-b75ffaca]{margin:0 8px;color:var(--el-text-color-placeholder)}.back-to-top[data-v-b75ffaca]{position:fixed;bottom:20px;right:20px;width:40px;height:40px;border-radius:50%;background-color:var(--el-color-primary);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 12px 0 rgba(0,0,0,.15);transition:all .3s;opacity:0;transform:translateY(20px);pointer-events:none;z-index:1000}.back-to-top.visible[data-v-b75ffaca]{opacity:.7;transform:translateY(0);pointer-events:auto}.back-to-top.visible[data-v-b75ffaca]:hover{opacity:1;transform:translateY(-5px)}.back-to-top i[data-v-b75ffaca]{font-size:20px}*{box-sizing:border-box;margin:0;padding:0}.converter-container{font-family:Noto Sans SC,sans-serif;max-width:100%;padding:20px;color:#333;min-height:100vh;background-color:#f5f7fa;display:flex;flex-direction:column;align-items:center}.title{text-align:center;margin-bottom:24px;color:#2c3e50;font-weight:700;font-size:1.8rem}.converter-card{background:#fff;border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,.08);width:100%;max-width:900px;overflow:hidden}.tabs{display:flex;border-bottom:1px solid #eaeaea}.tab-button{flex:1;padding:16px;background:none;border:none;cursor:pointer;font-size:1rem;font-weight:500;color:#666;transition:all .3s ease;position:relative}.tab-button:after{content:"";position:absolute;bottom:0;left:0;width:100%;height:3px;background-color:transparent;transition:all .3s ease}.tab-button:hover{color:#409eff;background-color:#f8fafc}.tab-button.active{color:#409eff;font-weight:600}.tab-button.active:after{background-color:#409eff}.content{padding:24px}.tab-content{display:flex;flex-direction:column;gap:24px}.upload-area{border:2px dashed #ccc;border-radius:8px;padding:40px 20px;text-align:center;min-height:500px;cursor:pointer;transition:all .3s ease;background-color:#f8fafc}.upload-area:hover{border-color:#409eff;background-color:#f0f7ff}.file-input{display:none}.upload-label{display:flex;flex-direction:column;align-items:center;gap:12px;cursor:pointer}.upload-icon{color:#409eff;margin-bottom:8px}.upload-text{font-size:1.1rem;font-weight:500;color:#2c3e50}.upload-hint{font-size:.9rem;color:#7f8c8d}.result-section{border:1px solid #eaeaea;border-radius:8px;overflow:hidden}.result-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background-color:#f8f9fa;border-bottom:1px solid #eaeaea}.action-buttons{display:flex;gap:8px}.action-button{display:flex;align-items:center;gap:6px;padding:6px 12px;background-color:#409eff;color:#fff;border:none;border-radius:4px;font-size:.9rem;cursor:pointer;transition:background-color .2s}.action-button:hover{background-color:#2980b9}.action-button svg{fill:currentColor}.json-preview{max-height:400px;overflow-y:auto;padding:16px;background-color:#f8f9fa;font-family:Courier New,Courier,monospace;font-size:.9rem;line-height:1.5;white-space:pre-wrap}.input-area{margin-bottom:16px}.json-textarea{width:100%;min-height:400px;padding:12px;border:1px solid #ddd;border-radius:6px;font-family:Courier New,Courier,monospace;font-size:.95rem;resize:vertical;transition:border-color .3s}.json-textarea:focus{outline:none;border-color:#409eff;box-shadow:0 0 0 2px rgba(52,152,219,.2)}.controls{display:flex;gap:12px;margin-bottom:16px}.convert-button,.download-button{padding:10px 20px;border:none;border-radius:6px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s}.convert-button{background-color:#409eff;color:#fff}.convert-button:hover{background-color:#2980b9}.convert-button:disabled{background-color:#95a5a6;cursor:not-allowed}.download-button{background-color:#2ecc71;color:#fff}.download-button:hover{background-color:#27ae60}.error-message{color:#e74c3c;padding:10px;background-color:#fdecea;border-radius:4px;margin-top:10px}.notification{position:fixed;bottom:20px;right:20px;padding:12px 24px;border-radius:6px;color:#fff;box-shadow:0 4px 12px rgba(0,0,0,.15);animation:slideIn .3s ease-out;z-index:1000}.notification.success{background-color:#2ecc71}.notification.error{background-color:#e74c3c}@keyframes slideIn{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}@media(max-width:768px){.converter-card{border-radius:0}.tabs{flex-direction:column}.tab-button{padding:12px}.content{padding:16px}.action-buttons{gap:6px}.action-buttons,.controls{flex-direction:column}.convert-button,.download-button{width:100%}}body{margin:0;padding:0;font-family:PingFang SC,Microsoft YaHei,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:14px;color:var(--el-text-color-primary);background-color:#f5f7fa}.app-container{display:flex;flex-direction:column;min-height:100vh}.app-header{background-color:#fff;box-shadow:0 2px 10px rgba(0,0,0,.05);padding:10px 20px;justify-content:space-between}.app-header,.app-header .logo-container{display:flex;align-items:center}.app-header .logo-container .logo{height:40px;margin-right:10px}.app-header .logo-container h1{font-size:20px;color:var(--el-color-primary);margin:0}.app-header .header-nav{display:flex;gap:10px}.app-header .header-nav .nav-link{color:var(--el-color-primary);text-decoration:none;padding:5px 15px;border-radius:4px;transition:background-color .3s,color .3s}.app-header .header-nav .nav-link:hover{background-color:var(--el-color-primary-light-9)}.app-header .header-nav .nav-link:active{background-color:var(--el-color-primary);color:#fff}.page-content{flex:1;padding:20px;max-width:1200px;margin:0 auto;width:100%;box-sizing:border-box}.page-title{font-size:24px;margin-bottom:20px;color:var(--el-text-color-primary)}.app-footer{background-color:#f5f7fa;border-top:1px solid #ebeef5;padding:15px 20px;text-align:center;font-size:14px;color:#606266}.card-container{background-color:#fff;border-radius:8px;box-shadow:0 2px 12px 0 rgba(0,0,0,.1);margin-bottom:20px;padding:20px}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.fade-in{animation:fadeIn .5s ease forwards}@media(max-width:768px){.app-header{flex-direction:column}.app-header .logo-container{margin-bottom:10px}.app-header .header-nav{width:100%;justify-content:center;flex-wrap:wrap}}