*{margin:0;padding:0;box-sizing:border-box}html,body{margin:0;padding:0;height:100%;width:100%}#app{height:100%;width:100%}.app-container[data-v-9605e20b]{width:100%;height:100vh;margin:0;padding:20px;background-color:#1a1a1a;display:flex;flex-direction:column;align-items:center}.nav[data-v-9605e20b]{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;background-color:#2d2d2d;padding:15px 25px;border-radius:12px;margin-bottom:30px;width:80%;max-width:1500px}.logo[data-v-9605e20b]{color:#fff;font-size:20px;font-weight:600;letter-spacing:.5px}.nav-center[data-v-9605e20b]{display:flex;gap:20px;justify-content:center}.logo-placeholder[data-v-9605e20b]{visibility:hidden}.mobile-icon[data-v-9605e20b]{display:none}.desktop-text[data-v-9605e20b]{display:block}@media (max-width: 768px){.nav[data-v-9605e20b]{grid-template-columns:auto auto;justify-content:space-between;width:100%;padding:12px}.logo-placeholder[data-v-9605e20b]{display:none}.mobile-icon[data-v-9605e20b]{display:block}.desktop-text[data-v-9605e20b]{display:none}.nav-center[data-v-9605e20b]{order:2;gap:10px}.logo[data-v-9605e20b]{order:1;margin-bottom:0}.nav-btn[data-v-9605e20b]{padding:8px 12px}}.nav-btn[data-v-9605e20b]{text-decoration:none;color:#b3b3b3;font-size:16px;font-weight:500;padding:8px 20px;border-radius:8px;transition:all .3s ease;text-align:center}.nav-btn[data-v-9605e20b]:hover{background-color:#404040;color:#fff}.nav-btn.active[data-v-9605e20b]{background-color:#4a4a4a;color:#fff}.nav-btn.active[data-v-9605e20b]:hover{background-color:#5a5a5a;color:#fff}.container[data-v-f4d1dbcb]{width:80%;max-width:1500px;height:100%;margin:0 auto;display:flex;flex-direction:column;overflow:hidden}.controls[data-v-f4d1dbcb]{display:flex;justify-content:center;margin-bottom:30px}.control-group[data-v-f4d1dbcb]{display:flex;align-items:center;gap:20px}.control-group label[data-v-f4d1dbcb]{color:#b3b3b3;font-size:16px;font-weight:500}.btn-group[data-v-f4d1dbcb]{display:flex;gap:10px}.btn-group button[data-v-f4d1dbcb]{background-color:transparent;color:#b3b3b3;border:none;padding:8px 16px;border-radius:8px;cursor:pointer;transition:all .3s ease;font-size:14px}.btn-group button[data-v-f4d1dbcb]:hover{color:#fff}.btn-group button.active[data-v-f4d1dbcb]{background-color:#4a4a4a;color:#fff}.content[data-v-f4d1dbcb]{display:flex;gap:0;flex:1;min-height:0;overflow:hidden}.left-panel[data-v-f4d1dbcb],.right-panel[data-v-f4d1dbcb]{flex:1;padding:20px;display:flex;flex-direction:column;gap:20px;overflow:hidden}.left-panel[data-v-f4d1dbcb]{background-color:#2d2d2d;cursor:pointer;border-top-left-radius:12px;border-bottom-left-radius:12px}.right-panel[data-v-f4d1dbcb]{background-color:#252525;border-top-right-radius:12px;border-bottom-right-radius:12px}.image-container[data-v-f4d1dbcb]{flex:1;background-color:transparent;overflow:hidden;display:flex;align-items:center;justify-content:center;min-height:0}.image-container img[data-v-f4d1dbcb]{max-width:100%;max-height:100%;object-fit:contain}.upload-placeholder[data-v-f4d1dbcb]{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:#b3b3b3;width:100%;transition:all .3s ease}.upload-placeholder p[data-v-f4d1dbcb]{margin-top:8px;font-size:14px}.info-bar[data-v-f4d1dbcb]{display:flex;justify-content:center;align-items:center;gap:10px;color:#b3b3b3;font-size:14px;padding:0 10px}.download-group[data-v-f4d1dbcb]{display:flex;align-items:center;gap:8px}.filename-input[data-v-f4d1dbcb]{background-color:#ffffff0d;border:none;color:#fff;padding:6px 8px;font-size:14px;width:120px;height:28px;transition:all .3s ease;border-radius:6px;line-height:1}.filename-input[data-v-f4d1dbcb]:focus{outline:none;background-color:#ffffff14}.filename-input[data-v-f4d1dbcb]::placeholder{color:#666}.download-btn[data-v-f4d1dbcb]{background-color:#ffffff1a;color:#fff;border:none;padding:6px 12px;height:28px;cursor:pointer;transition:all .3s ease;font-size:14px;border-radius:6px;line-height:1}.download-btn[data-v-f4d1dbcb]:hover{background-color:#ffffff26}@media (max-width: 768px){.container[data-v-f4d1dbcb]{width:100%}.content[data-v-f4d1dbcb]{flex-direction:column}.left-panel[data-v-f4d1dbcb]{border-top-left-radius:12px;border-top-right-radius:12px;border-bottom-left-radius:0}.right-panel[data-v-f4d1dbcb]{border-top-right-radius:0;border-bottom-right-radius:12px;border-bottom-left-radius:12px}.controls[data-v-f4d1dbcb]{margin-bottom:15px}.control-group[data-v-f4d1dbcb]{flex-direction:column;gap:5px}.btn-group[data-v-f4d1dbcb]{width:100%;justify-content:space-between}.btn-group button[data-v-f4d1dbcb]{padding:4px 6px;font-size:13px}}.container[data-v-564e2840]{width:80%;max-width:1500px;height:100%;margin:0 auto;display:flex;flex-direction:column;overflow:hidden}.controls[data-v-564e2840]{display:flex;justify-content:center;margin-bottom:30px}.control-group[data-v-564e2840]{display:flex;align-items:center;gap:20px}.control-group label[data-v-564e2840]{color:#b3b3b3;font-size:16px;font-weight:500}.btn-group[data-v-564e2840]{display:flex;gap:10px}.btn-group button[data-v-564e2840]{background-color:transparent;color:#b3b3b3;border:none;padding:8px 16px;border-radius:8px;cursor:pointer;transition:all .3s ease;font-size:14px}.btn-group button[data-v-564e2840]:hover{color:#fff}.btn-group button.active[data-v-564e2840]{background-color:#4a4a4a;color:#fff}.content[data-v-564e2840]{display:flex;gap:0;flex:1;min-height:0;overflow:hidden}.left-panel[data-v-564e2840],.right-panel[data-v-564e2840]{flex:1;padding:20px;display:flex;flex-direction:column;gap:20px;overflow:hidden}.left-panel[data-v-564e2840]{background-color:#2d2d2d;cursor:pointer;border-top-left-radius:12px;border-bottom-left-radius:12px}.right-panel[data-v-564e2840]{background-color:#252525;border-top-right-radius:12px;border-bottom-right-radius:12px}.image-container[data-v-564e2840]{flex:1;background-color:transparent;overflow:hidden;display:flex;align-items:center;justify-content:center;min-height:0}.image-container video[data-v-564e2840]{max-width:100%;max-height:100%;object-fit:contain}.upload-placeholder[data-v-564e2840]{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:#b3b3b3;width:100%;transition:all .3s ease}.upload-placeholder p[data-v-564e2840]{margin-top:8px;font-size:14px}.info-bar[data-v-564e2840]{display:flex;justify-content:center;align-items:center;gap:10px;color:#b3b3b3;font-size:14px;padding:0 10px}.download-group[data-v-564e2840]{display:flex;align-items:center;gap:8px}.filename-input[data-v-564e2840]{background-color:#ffffff0d;border:none;color:#fff;padding:6px 8px;font-size:14px;width:120px;height:28px;transition:all .3s ease;border-radius:6px;line-height:1}.filename-input[data-v-564e2840]:focus{outline:none;background-color:#ffffff14}.filename-input[data-v-564e2840]::placeholder{color:#666}.download-btn[data-v-564e2840]{background-color:#ffffff1a;color:#fff;border:none;padding:6px 12px;height:28px;cursor:pointer;transition:all .3s ease;font-size:14px;border-radius:6px;line-height:1}.download-btn[data-v-564e2840]:hover{background-color:#ffffff26}.progress-ring-container[data-v-564e2840]{position:relative;display:flex;align-items:center;justify-content:center;width:120px;height:120px}.progress-ring[data-v-564e2840]{transform:rotate(-90deg);will-change:transform}.progress-ring-circle[data-v-564e2840]{stroke-dasharray:326.73;stroke-dashoffset:326.73;transition:stroke-dashoffset .3s ease-out;transform-origin:center;stroke:#e8e8af;stroke-linecap:round}.progress-text[data-v-564e2840]{position:absolute;font-size:20px;color:#fff;font-weight:700;transition:all .3s ease-out}.progress-ring-circle-bg[data-v-564e2840]{opacity:.2}@keyframes rotate-564e2840{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width: 768px){.container[data-v-564e2840]{width:100%}.content[data-v-564e2840]{flex-direction:column}.left-panel[data-v-564e2840]{border-top-left-radius:12px;border-top-right-radius:12px;border-bottom-left-radius:0}.right-panel[data-v-564e2840]{border-top-right-radius:0;border-bottom-right-radius:12px;border-bottom-left-radius:12px}.controls[data-v-564e2840]{margin-bottom:15px}.control-group[data-v-564e2840]{flex-direction:column;gap:5px}.btn-group[data-v-564e2840]{width:100%;justify-content:space-between}.btn-group button[data-v-564e2840]{padding:4px 6px;font-size:13px}}