:root{--color-bg-primary: #0d0f14;--color-bg-secondary: #13161e;--color-bg-card: #1a1e2a;--color-bg-card-hover: #1f2435;--color-bg-overlay: rgba(26, 30, 42, .85);--color-accent-from: #6c63ff;--color-accent-to: #3ecfcf;--color-accent-solid: #6c63ff;--color-accent-light: rgba(108, 99, 255, .15);--color-accent-border: rgba(108, 99, 255, .4);--color-text-primary: #e8eaf0;--color-text-secondary: #8b95b0;--color-text-muted: #555e78;--color-text-accent: #a29bfe;--color-success: #00d4aa;--color-success-bg: rgba(0, 212, 170, .1);--color-error: #ff6b6b;--color-error-bg: rgba(255, 107, 107, .1);--color-warning: #ffd93d;--color-border: rgba(255, 255, 255, .06);--color-border-accent: rgba(108, 99, 255, .35);--font-family: "Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 2rem;--font-size-4xl: 2.5rem;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--spacing-2xl: 48px;--spacing-3xl: 64px;--radius-sm: 6px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px;--radius-full: 9999px;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .3);--shadow-md: 0 4px 20px rgba(0, 0, 0, .4);--shadow-lg: 0 8px 40px rgba(0, 0, 0, .5);--shadow-accent: 0 0 30px rgba(108, 99, 255, .2);--shadow-glow: 0 0 20px rgba(108, 99, 255, .4);--transition-fast: .15s ease;--transition-base: .25s ease;--transition-slow: .4s ease;--glass-bg: rgba(255, 255, 255, .03);--glass-border: rgba(255, 255, 255, .07);--glass-backdrop: blur(20px)}[data-theme=light]{--color-bg-primary: #f0f2f8;--color-bg-secondary: #e4e8f2;--color-bg-card: #ffffff;--color-bg-card-hover: #f5f7ff;--color-bg-overlay: rgba(255, 255, 255, .85);--color-text-primary: #0d1020;--color-text-secondary: #2a3050;--color-text-muted: #5a6280;--color-text-accent: #4c44cc;--color-border: rgba(0, 0, 0, .12);--color-border-accent: rgba(76, 68, 204, .35);--color-accent-solid: #4c44cc;--color-accent-light: rgba(76, 68, 204, .1);--color-accent-border: rgba(76, 68, 204, .4);--color-success: #008a6e;--color-error: #cc3333;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .08);--shadow-md: 0 4px 20px rgba(0, 0, 0, .1);--shadow-lg: 0 8px 40px rgba(0, 0, 0, .12);--shadow-accent: 0 0 30px rgba(76, 68, 204, .1);--glass-bg: rgba(255, 255, 255, .7);--glass-border: rgba(0, 0, 0, .1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth}body{font-family:var(--font-family);font-size:var(--font-size-base);background-color:var(--color-bg-primary);color:var(--color-text-primary);line-height:1.6;min-height:100vh;background-image:radial-gradient(ellipse at 20% 20%,rgba(108,99,255,.08) 0%,transparent 50%),radial-gradient(ellipse at 80% 80%,rgba(62,207,207,.06) 0%,transparent 50%),radial-gradient(circle at 1px 1px,rgba(255,255,255,.03) 1px,transparent 0);background-size:100% 100%,100% 100%,32px 32px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh;display:flex;flex-direction:column}a{color:var(--color-text-accent);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-accent-solid)}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--color-bg-secondary)}::-webkit-scrollbar-thumb{background:var(--color-border-accent);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--color-accent-solid)}.animated-bg{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-2;background:linear-gradient(135deg,#0d0f14,#1a0e3e,#0d1225,#12203a,#1a0e3e,#0d0f14);background-size:300% 300%;animation:gradientShift 10s ease infinite}@keyframes gradientShift{0%{background-position:0% 0%}50%{background-position:100% 100%}to{background-position:0% 0%}}.floating-shapes{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;overflow:hidden;pointer-events:none}.floating-shapes .shape{position:absolute;border-radius:50%;will-change:transform}.floating-shapes .shape:nth-child(1){width:800px;height:800px;left:-200px;top:-150px;background:radial-gradient(circle,rgba(108,99,255,.25),transparent 60%);animation:floatDrift1 18s ease-in-out infinite}.floating-shapes .shape:nth-child(2){width:700px;height:700px;right:-200px;top:10%;background:radial-gradient(circle,rgba(62,207,207,.2),transparent 60%);animation:floatDrift2 22s ease-in-out infinite}.floating-shapes .shape:nth-child(3){width:600px;height:600px;left:30%;bottom:-100px;background:radial-gradient(circle,rgba(162,155,254,.2),transparent 60%);animation:floatDrift3 15s ease-in-out infinite}.floating-shapes .shape:nth-child(4){width:500px;height:500px;left:-50px;bottom:10%;background:radial-gradient(circle,rgba(255,107,157,.15),transparent 60%);animation:floatDrift4 20s ease-in-out infinite}.floating-shapes .shape:nth-child(5){width:650px;height:650px;right:-100px;bottom:-150px;background:radial-gradient(circle,rgba(62,207,207,.18),transparent 60%);animation:floatDrift5 25s ease-in-out infinite}.floating-shapes .shape:nth-child(6){width:400px;height:400px;left:45%;top:5%;background:radial-gradient(circle,rgba(255,217,61,.12),transparent 60%);animation:floatDrift6 16s ease-in-out infinite}@keyframes floatDrift1{0%,to{transform:translate(0) scale(1)}33%{transform:translate(80px,50px) scale(1.1)}66%{transform:translate(-40px,-30px) scale(.95)}}@keyframes floatDrift2{0%,to{transform:translate(0) scale(1)}25%{transform:translate(-60px,60px) scale(1.08)}50%{transform:translate(40px,30px) scale(.92)}75%{transform:translate(-25px,-50px) scale(1.05)}}@keyframes floatDrift3{0%,to{transform:translate(0)}50%{transform:translate(90px,-60px)}}@keyframes floatDrift4{0%,to{transform:translate(0) scale(1)}50%{transform:translate(50px,-40px) scale(1.15)}}@keyframes floatDrift5{0%,to{transform:translate(0) scale(1)}40%{transform:translate(-70px,-50px) scale(1.1)}80%{transform:translate(40px,25px) scale(.9)}}@keyframes floatDrift6{0%,to{transform:translate(0)}50%{transform:translate(-50px,55px)}}[data-theme=light] .animated-bg{background:linear-gradient(135deg,#f0f2f8,#d8d0f8,#e8e4ff,#d0e0f8,#d8d0f8,#f0f2f8);background-size:300% 300%}[data-theme=light] .floating-shapes .shape:nth-child(1){background:radial-gradient(circle,rgba(108,99,255,.18),transparent 60%)}[data-theme=light] .floating-shapes .shape:nth-child(2){background:radial-gradient(circle,rgba(62,180,207,.15),transparent 60%)}[data-theme=light] .floating-shapes .shape:nth-child(3){background:radial-gradient(circle,rgba(140,130,255,.15),transparent 60%)}[data-theme=light] .floating-shapes .shape:nth-child(4){background:radial-gradient(circle,rgba(255,120,170,.12),transparent 60%)}[data-theme=light] .floating-shapes .shape:nth-child(5){background:radial-gradient(circle,rgba(62,180,207,.12),transparent 60%)}[data-theme=light] .floating-shapes .shape:nth-child(6){background:radial-gradient(circle,rgba(255,200,60,.1),transparent 60%)}@media (prefers-reduced-motion: reduce){.animated-bg,.floating-shapes .shape{animation:none}}@media (max-width: 640px){.floating-shapes .shape:nth-child(4),.floating-shapes .shape:nth-child(5),.floating-shapes .shape:nth-child(6){display:none}.floating-shapes .shape:nth-child(1){width:500px;height:500px}.floating-shapes .shape:nth-child(2){width:400px;height:400px}}@keyframes fadeIn{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInScale{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes borderGlow{0%,to{border-color:var(--color-accent-border);box-shadow:var(--shadow-accent)}50%{border-color:var(--color-accent-solid);box-shadow:var(--shadow-glow)}}@keyframes progressPulse{0%,to{opacity:1}50%{opacity:.7}}@keyframes slideDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn var(--transition-base) ease forwards}.animate-fade-in-scale{animation:fadeInScale var(--transition-base) ease forwards}.spinner{display:inline-block;animation:spin 1.2s linear infinite}.animate-pulse{animation:pulse 2s ease-in-out infinite}.btn{display:inline-flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-lg);border:none;border-radius:var(--radius-full);font-family:var(--font-family);font-size:var(--font-size-sm);font-weight:600;cursor:pointer;transition:all var(--transition-base);white-space:nowrap;letter-spacing:.02em}.btn:focus-visible{outline:2px solid var(--color-accent-solid);outline-offset:2px}.btn--sm{padding:6px var(--spacing-md);font-size:var(--font-size-xs)}.btn--lg{padding:var(--spacing-md) var(--spacing-xl);font-size:var(--font-size-base)}.btn--primary{background:linear-gradient(135deg,var(--color-accent-from),var(--color-accent-to));color:#fff;box-shadow:0 4px 15px #6c63ff4d}.btn--primary:hover{transform:translateY(-1px);box-shadow:0 6px 20px #6c63ff73;filter:brightness(1.1)}.btn--primary:active{transform:translateY(0)}.btn--secondary{background:var(--glass-bg);color:var(--color-text-primary);border:1px solid var(--glass-border);-webkit-backdrop-filter:var(--glass-backdrop);backdrop-filter:var(--glass-backdrop)}.btn--secondary:hover{background:var(--color-bg-card-hover);border-color:var(--color-border-accent);color:var(--color-text-accent)}.btn--ghost{background:transparent;color:var(--color-text-secondary);border:1px solid transparent}.btn--ghost:hover{background:var(--color-accent-light);color:var(--color-text-primary);border-color:var(--color-border-accent)}.btn:disabled{opacity:.4;cursor:not-allowed;pointer-events:none}.format-badge{display:inline-flex;align-items:center;padding:4px 10px;border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:700;letter-spacing:.05em;background:var(--color-accent-light);color:var(--color-text-accent);border:1px solid var(--color-accent-border);transition:all var(--transition-fast)}.format-badge.coming-soon{background:#ffffff08;color:var(--color-text-muted);border-color:var(--color-border)}.format-badge--extra{background:#ffffff05;color:var(--color-text-muted);border-color:var(--color-border);font-size:.65rem}.format-badge-divider{font-size:var(--font-size-xs);color:var(--color-text-muted);display:flex;align-items:center;padding:0 2px}.app{display:flex;flex-direction:column;min-height:100vh}.app-header{padding:var(--spacing-xl) var(--spacing-xl) var(--spacing-lg);text-align:center;border-bottom:1px solid var(--color-border);background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-backdrop);backdrop-filter:var(--glass-backdrop);animation:fadeIn .5s ease forwards}.header-content{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm);margin-bottom:var(--spacing-md)}.logo{display:flex;align-items:center;gap:var(--spacing-md)}.logo-icon{font-size:2.8rem;filter:drop-shadow(0 0 16px rgba(108,99,255,.6))}.logo-text{font-size:var(--font-size-4xl);font-weight:800;background:linear-gradient(135deg,var(--color-accent-from),var(--color-accent-to));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.02em}.header-subtitle{font-size:var(--font-size-sm);color:var(--color-text-secondary);font-weight:400}.supported-formats{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--spacing-sm)}.app-main{flex:1;display:flex;flex-direction:column;gap:var(--spacing-xl);padding:var(--spacing-2xl) var(--spacing-xl);max-width:900px;width:100%;margin:0 auto}.new-file-section .dropzone{padding:var(--spacing-lg);min-height:100px}.new-file-section .dropzone-icon{font-size:1.5rem}.new-file-section .dropzone-main-text{font-size:var(--font-size-sm)}.processing-section{animation:fadeInScale var(--transition-base) ease forwards}.error-section{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-lg);animation:fadeIn var(--transition-base) ease forwards}.error-card{display:flex;align-items:flex-start;gap:var(--spacing-md);padding:var(--spacing-lg) var(--spacing-xl);background:var(--color-error-bg);border:1px solid rgba(255,107,107,.3);border-radius:var(--radius-lg);width:100%;max-width:600px}.error-icon{font-size:1.5rem;flex-shrink:0;margin-top:2px}.error-title{font-size:var(--font-size-base);font-weight:600;color:var(--color-error);margin-bottom:var(--spacing-xs)}.error-message{font-size:var(--font-size-sm);color:var(--color-text-secondary);white-space:pre-line;line-height:1.7}.app-footer{padding:var(--spacing-lg) var(--spacing-xl);text-align:center;border-top:1px solid var(--color-border);background:var(--glass-bg)}.app-footer p{font-size:var(--font-size-xs);color:var(--color-text-muted)}.header-controls{display:flex;align-items:center;gap:var(--spacing-sm);flex-shrink:0}.theme-toggle-btn{width:38px;height:38px;display:flex;align-items:center;justify-content:center;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-full);cursor:pointer;font-size:1.1rem;transition:all var(--transition-fast);-webkit-backdrop-filter:var(--glass-backdrop);backdrop-filter:var(--glass-backdrop)}.theme-toggle-btn:hover{background:var(--color-accent-light);border-color:var(--color-accent-border);transform:rotate(15deg) scale(1.08)}[data-theme=light] body{background:var(--color-bg-primary)}[data-theme=light] .app-header{background:#f0f2f8eb;border-bottom-color:#00000014}[data-theme=light] .app-footer{border-top-color:#0000000f}[data-theme=light] .tab-btn{color:var(--color-text-secondary);background:#0000000a}[data-theme=light] .tab-btn:hover{color:var(--color-text-primary);background:#00000012}[data-theme=light] .tab-btn--active{color:#fff!important;background:var(--color-accent-solid)!important}[data-theme=light] .dropzone{background:#fffc;border-color:#4c44cc40}[data-theme=light] .dropzone-main-text{color:var(--color-text-primary)}[data-theme=light] .dropzone-sub-text{color:var(--color-text-secondary)}[data-theme=light] .file-list-container{background:#fff;border-color:#0000001a}[data-theme=light] .archive-name{color:var(--color-text-primary)}[data-theme=light] .archive-stats{color:var(--color-text-secondary)}[data-theme=light] .file-item{color:var(--color-text-primary);border-bottom-color:#0000000d}[data-theme=light] .file-name{color:var(--color-text-primary)}[data-theme=light] .file-size,[data-theme=light] .select-all-label{color:var(--color-text-secondary)}[data-theme=light] .format-badge{background:#4c44cc1f;color:var(--color-accent-solid);border-color:#4c44cc40}[data-theme=light] .header-subtitle{color:var(--color-text-secondary)}@media (max-width: 640px){.app-header{padding:var(--spacing-lg) var(--spacing-md)}.logo-text{font-size:var(--font-size-3xl)}.app-main{padding:var(--spacing-lg) var(--spacing-md);gap:var(--spacing-lg)}}.lang-selector{position:relative;flex-shrink:0}.lang-trigger{display:flex;align-items:center;gap:6px;padding:7px 12px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-full);color:var(--color-text-secondary);font-family:var(--font-family);font-size:var(--font-size-sm);font-weight:500;cursor:pointer;transition:all var(--transition-fast);-webkit-backdrop-filter:var(--glass-backdrop);backdrop-filter:var(--glass-backdrop);white-space:nowrap}.lang-trigger:hover{background:var(--color-accent-light);border-color:var(--color-accent-border);color:var(--color-text-primary)}.lang-flag{font-size:1rem;line-height:1}.lang-label{font-size:var(--font-size-xs);letter-spacing:.02em}.lang-arrow{font-size:.65rem;color:var(--color-text-muted);transition:transform var(--transition-fast)}.lang-arrow--open{transform:rotate(180deg)}.lang-dropdown{position:absolute;top:calc(100% + 8px);right:0;z-index:100;list-style:none;min-width:160px;background:var(--color-bg-card);border:1px solid var(--color-border-accent);border-radius:var(--radius-md);box-shadow:var(--shadow-lg),var(--shadow-accent);overflow:hidden;animation:slideDown var(--transition-fast) ease forwards}.lang-option{display:flex;align-items:center;gap:var(--spacing-sm);padding:10px var(--spacing-md);font-size:var(--font-size-sm);color:var(--color-text-secondary);cursor:pointer;transition:background var(--transition-fast)}.lang-option:hover{background:var(--color-accent-light);color:var(--color-text-primary)}.lang-option--active{color:var(--color-text-accent);background:#6c63ff14}.lang-check{margin-left:auto;font-size:var(--font-size-xs);color:var(--color-accent-solid);font-weight:700}.header-top-row{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--spacing-md);width:100%;max-width:900px;margin:0 auto var(--spacing-md)}.header-content{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xs);flex:1}@media (max-width: 640px){.header-top-row{flex-direction:column;align-items:center}.lang-selector{align-self:flex-end;position:absolute;top:var(--spacing-md);right:var(--spacing-md)}}.tab-bar{display:flex;gap:4px;background:var(--color-bg-secondary);border:1px solid var(--glass-border);border-radius:var(--radius-full);padding:4px;width:fit-content;margin:0 auto var(--spacing-lg)}.tab-btn{padding:10px 28px;border-radius:var(--radius-full);border:none;background:transparent;color:var(--color-text-muted);font-family:var(--font-family);font-size:var(--font-size-sm);font-weight:600;cursor:pointer;transition:all var(--transition-base);white-space:nowrap;letter-spacing:.02em}.tab-btn:hover{color:var(--color-text-secondary);background:var(--color-accent-light)}.tab-btn--active{background:linear-gradient(135deg,var(--color-accent-solid),var(--color-accent-secondary));color:#fff;box-shadow:0 4px 15px #6c63ff66}@media (max-width: 480px){.tab-btn{padding:8px 18px;font-size:var(--font-size-xs)}}.dropzone-wrapper{display:flex;flex-direction:column;gap:var(--spacing-sm);animation:fadeIn .4s ease forwards}.dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-md);min-height:220px;padding:var(--spacing-2xl) var(--spacing-xl);border:2px dashed var(--color-border-accent);border-radius:var(--radius-xl);background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-backdrop);backdrop-filter:var(--glass-backdrop);cursor:pointer;transition:all var(--transition-base);position:relative;overflow:hidden}.dropzone:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at center,var(--color-accent-light) 0%,transparent 70%);opacity:0;transition:opacity var(--transition-base);pointer-events:none}.dropzone:hover:before,.dropzone--dragover:before{opacity:1}.dropzone:hover{border-color:var(--color-accent-solid);box-shadow:var(--shadow-accent);transform:translateY(-2px)}.dropzone--dragover{border-color:var(--color-accent-solid);border-style:solid;box-shadow:var(--shadow-glow);animation:borderGlow 1.5s ease infinite;transform:scale(1.01)}.dropzone--disabled{opacity:.6;cursor:not-allowed;pointer-events:none}.dropzone-icon{font-size:3.5rem;line-height:1;transition:transform var(--transition-base);filter:drop-shadow(0 0 12px rgba(108,99,255,.4))}.dropzone:hover .dropzone-icon,.dropzone--dragover .dropzone-icon{transform:scale(1.15) translateY(-4px)}.upload-icon{display:inline-block}.drop-icon{display:inline-block;animation:pulse .8s ease infinite}.dropzone-text{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xs);text-align:center;position:relative;z-index:1}.dropzone-main-text{font-size:var(--font-size-lg);font-weight:600;color:var(--color-text-primary);transition:color var(--transition-fast)}.dropzone:hover .dropzone-main-text{color:var(--color-text-accent)}.dropzone-sub-text{font-size:var(--font-size-sm);color:var(--color-text-muted);letter-spacing:.05em}.dropzone-error{font-size:var(--font-size-sm);color:var(--color-error);text-align:center;padding:var(--spacing-xs) var(--spacing-md);background:var(--color-error-bg);border-radius:var(--radius-sm);border:1px solid rgba(255,107,107,.2);animation:slideDown var(--transition-fast) ease forwards}.size-warning{padding:var(--spacing-sm) var(--spacing-md);margin-top:var(--spacing-sm);background:#ffc10714;border:1px solid rgba(255,193,7,.35);border-radius:var(--radius-md);color:#ffc107;font-size:var(--font-size-sm);line-height:1.5;animation:slideDown var(--transition-fast) ease forwards}.size-error{padding:var(--spacing-sm) var(--spacing-md);margin-top:var(--spacing-sm);background:#ff505014;border:1px solid rgba(255,80,80,.35);border-radius:var(--radius-md);color:#f88;font-size:var(--font-size-sm);line-height:1.5;animation:slideDown var(--transition-fast) ease forwards}.progress-container{padding:var(--spacing-lg) var(--spacing-xl);background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);animation:fadeInScale var(--transition-base) ease forwards}.progress-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-sm)}.progress-label{font-size:var(--font-size-sm);color:var(--color-text-secondary);font-weight:500}.progress-percent{font-size:var(--font-size-sm);font-weight:700;color:var(--color-text-accent);font-variant-numeric:tabular-nums}.progress-track{height:8px;background:var(--color-bg-secondary);border-radius:var(--radius-full);overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,var(--color-accent-from),var(--color-accent-to));border-radius:var(--radius-full);transition:width .3s ease;position:relative;overflow:hidden;animation:progressPulse 1.5s ease infinite}.progress-fill:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.25) 50%,transparent 100%);background-size:200% 100%;animation:shimmer 1.5s linear infinite}.file-list-container{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-xl);overflow:hidden;animation:fadeIn var(--transition-base) ease forwards;box-shadow:var(--shadow-md)}.file-list-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-lg) var(--spacing-xl);border-bottom:1px solid var(--color-border);background:var(--glass-bg)}.archive-info{display:flex;align-items:center;gap:var(--spacing-md)}.archive-icon{font-size:2rem;filter:drop-shadow(0 0 8px rgba(108,99,255,.4))}.archive-name{font-size:var(--font-size-lg);font-weight:700;color:var(--color-text-primary);word-break:break-all}.archive-stats{font-size:var(--font-size-sm);color:var(--color-text-muted);margin-top:2px}.file-list-actions{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--spacing-md);padding:var(--spacing-md) var(--spacing-xl);border-bottom:1px solid var(--color-border);background:var(--color-bg-secondary)}.select-all-label{display:flex;align-items:center;gap:var(--spacing-sm);font-size:var(--font-size-sm);color:var(--color-text-secondary);cursor:pointer;transition:color var(--transition-fast)}.select-all-label:hover{color:var(--color-text-primary)}.select-all-label input[type=checkbox]{width:16px;height:16px;accent-color:var(--color-accent-solid);cursor:pointer}.action-buttons{display:flex;gap:var(--spacing-sm);flex-wrap:wrap}.file-list{max-height:500px;overflow-y:auto}.file-list-empty{padding:var(--spacing-2xl);text-align:center;color:var(--color-text-muted);font-size:var(--font-size-sm)}.file-item{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-xl);border-bottom:1px solid var(--color-border);transition:background var(--transition-fast);min-height:46px}.file-item:last-child{border-bottom:none}.file-item:hover{background:var(--color-bg-card-hover)}.file-item--selected{background:var(--color-accent-light);border-left:3px solid var(--color-accent-solid)}.file-item--directory{background:#ffffff04}.file-item--directory:hover{background:#ffffff08}.file-checkbox{width:15px;height:15px;flex-shrink:0;accent-color:var(--color-accent-solid);cursor:pointer}.file-icon{font-size:1rem;flex-shrink:0;width:20px;text-align:center}.file-name{flex:1;font-size:var(--font-size-sm);color:var(--color-text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file-item--directory .file-name{color:var(--color-text-accent);font-weight:500}.file-size{font-size:var(--font-size-xs);color:var(--color-text-muted);font-variant-numeric:tabular-nums;white-space:nowrap;min-width:60px;text-align:right}.file-download-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:transparent;color:var(--color-text-muted);font-size:.75rem;cursor:pointer;transition:all var(--transition-fast);flex-shrink:0;opacity:0}.file-item:hover .file-download-btn{opacity:1}.file-download-btn:hover{background:var(--color-accent-light);border-color:var(--color-accent-border);color:var(--color-text-accent);transform:scale(1.1)}@media (max-width: 640px){.file-list-header,.file-list-actions,.file-item{padding-left:var(--spacing-md);padding-right:var(--spacing-md)}.file-list-actions{flex-direction:column;align-items:flex-start}.file-size{display:none}}.compress-panel{display:flex;flex-direction:column;gap:var(--spacing-lg);width:100%;max-width:700px;margin:0 auto}.compress-dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:var(--spacing-xl) var(--spacing-lg);background:var(--glass-bg);border:2px dashed var(--color-border);border-radius:var(--radius-xl);cursor:pointer;transition:all var(--transition-base);text-align:center;min-height:140px}.compress-dropzone:hover,.compress-dropzone--dragover{border-color:var(--color-accent-solid);background:var(--color-accent-light);transform:scale(1.01)}.compress-drop-icon{font-size:2.2rem}.compress-drop-title{font-size:var(--font-size-md);font-weight:600;color:var(--color-text-primary)}.compress-drop-subtitle{font-size:var(--font-size-sm);color:var(--color-text-muted)}.compress-file-list{background:var(--color-bg-card);border:1px solid var(--glass-border);border-radius:var(--radius-lg);overflow:hidden}.compress-file-list-header{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-md) var(--spacing-lg);border-bottom:1px solid var(--glass-border);background:var(--glass-bg)}.compress-file-count{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text-accent)}.compress-file-total-size{font-weight:400;color:var(--color-text-muted)}.compress-file-items{max-height:220px;overflow-y:auto}.compress-file-item{display:flex;align-items:center;gap:var(--spacing-sm);padding:10px var(--spacing-lg);border-bottom:1px solid rgba(255,255,255,.04);transition:background var(--transition-fast)}.compress-file-item:hover{background:var(--color-accent-light)}.compress-file-item:last-child{border-bottom:none}.compress-file-icon{font-size:1rem;flex-shrink:0}.compress-file-name{flex:1;font-size:var(--font-size-sm);color:var(--color-text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.compress-file-size{font-size:var(--font-size-xs);color:var(--color-text-muted);flex-shrink:0}.compress-remove-btn{background:none;border:none;color:var(--color-text-muted);cursor:pointer;padding:2px 6px;border-radius:var(--radius-sm);font-size:var(--font-size-xs);transition:all var(--transition-fast);flex-shrink:0}.compress-remove-btn:hover{background:#ff505026;color:#f55}.compress-empty{text-align:center;padding:var(--spacing-xl);color:var(--color-text-muted);font-size:var(--font-size-sm)}.format-selector{display:flex;flex-direction:column;gap:var(--spacing-sm)}.format-selector-label{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text-secondary)}.format-options{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-sm)}.format-option{display:flex;flex-direction:column;align-items:center;gap:4px;padding:var(--spacing-md) var(--spacing-sm);background:var(--color-bg-card);border:1px solid var(--glass-border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);text-align:center}.format-option:hover{border-color:var(--color-accent-border);background:var(--color-accent-light)}.format-option--active{border-color:var(--color-accent-solid);background:#6c63ff1f;box-shadow:0 0 0 2px #6c63ff40}.format-option-icon{font-size:1.4rem}.format-option-name{font-size:var(--font-size-sm);font-weight:700;color:var(--color-text-primary)}.format-option-desc{font-size:.7rem;color:var(--color-text-muted);line-height:1.3}.compress-name-row{display:flex;align-items:center;gap:var(--spacing-md)}.compress-name-label{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text-secondary);white-space:nowrap;flex-shrink:0}.compress-name-input-wrap{display:flex;align-items:center;flex:1;background:var(--color-bg-card);border:1px solid var(--glass-border);border-radius:var(--radius-md);overflow:hidden;transition:border-color var(--transition-fast)}.compress-name-input-wrap:focus-within{border-color:var(--color-accent-solid)}.compress-name-input{flex:1;padding:10px var(--spacing-md);background:transparent;border:none;color:var(--color-text-primary);font-family:var(--font-family);font-size:var(--font-size-sm);outline:none}.compress-name-ext{padding:0 var(--spacing-md) 0 4px;font-size:var(--font-size-sm);color:var(--color-text-muted);font-weight:500;white-space:nowrap}.compress-error{padding:var(--spacing-sm) var(--spacing-md);background:#ff505014;border:1px solid rgba(255,80,80,.25);border-radius:var(--radius-md);color:#f88;font-size:var(--font-size-sm)}.compress-action-btn{width:100%;padding:14px;font-size:var(--font-size-md);display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm)}.compress-action-btn:disabled{opacity:.45;cursor:not-allowed}@media (max-width: 560px){.format-options{grid-template-columns:repeat(3,1fr)}.compress-name-row{flex-direction:column;align-items:flex-start}.compress-name-input-wrap{width:100%}}.howto-section{width:100%;max-width:900px;margin:var(--spacing-xl) auto 0;padding:var(--spacing-xl) var(--spacing-lg);border-top:1px solid var(--glass-border)}.howto-header{text-align:center;margin-bottom:var(--spacing-xl)}.howto-title{font-size:var(--font-size-2xl);font-weight:700;background:var(--gradient-accent);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:var(--spacing-xs)}.howto-subtitle{font-size:var(--font-size-md);color:var(--color-text-muted)}.howto-columns{display:flex;gap:var(--spacing-xl);align-items:flex-start;margin-bottom:var(--spacing-xl)}.howto-col{flex:1}.howto-divider{width:1px;background:var(--glass-border);align-self:stretch;flex-shrink:0}.howto-col-title{display:flex;align-items:center;gap:var(--spacing-sm);font-size:var(--font-size-lg);font-weight:700;color:var(--color-text-primary);margin-bottom:var(--spacing-md)}.howto-col-icon{font-size:1.3rem}.step-cards{display:flex;flex-direction:column;gap:var(--spacing-sm)}.step-card{display:grid;grid-template-columns:28px 36px 1fr;grid-template-rows:auto auto;column-gap:var(--spacing-sm);align-items:start;padding:var(--spacing-md);background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-lg);transition:all var(--transition-base)}.step-card:hover{border-color:var(--color-accent-border);background:var(--color-accent-light);transform:translate(4px)}.step-number{grid-row:1 / 3;grid-column:1;display:flex;align-items:center;justify-content:center;width:24px;height:24px;background:var(--color-accent-solid);border-radius:50%;font-size:var(--font-size-xs);font-weight:700;color:#fff;flex-shrink:0;margin-top:2px}.step-icon{grid-row:1 / 3;grid-column:2;font-size:1.5rem;display:flex;align-items:center;justify-content:center}.step-title{grid-row:1;grid-column:3;font-size:var(--font-size-sm);font-weight:600;color:var(--color-text-primary);margin:0}.step-desc{grid-row:2;grid-column:3;font-size:var(--font-size-xs);color:var(--color-text-muted);margin:2px 0 0;line-height:1.5}.howto-privacy-banner{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-lg);background:linear-gradient(135deg,#6c63ff14,#63e2ff0a);border:1px solid var(--color-accent-border);border-radius:var(--radius-xl)}.howto-privacy-icon{font-size:2rem;flex-shrink:0}.howto-privacy-title{display:block;font-size:var(--font-size-md);font-weight:700;color:var(--color-text-accent);margin-bottom:4px}.howto-privacy-desc{font-size:var(--font-size-sm);color:var(--color-text-muted);margin:0}@media (max-width: 680px){.howto-columns{flex-direction:column;gap:var(--spacing-lg)}.howto-divider{width:100%;height:1px;align-self:auto}.howto-section{padding:var(--spacing-lg) var(--spacing-md)}}.preview-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;background:#000000bf;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;padding:var(--spacing-md);animation:fadeIn .15s ease forwards}.preview-modal{background:var(--color-bg-card);border:1px solid var(--color-border-accent);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg),var(--shadow-accent);width:100%;max-width:860px;max-height:90vh;display:flex;flex-direction:column;overflow:hidden}.preview-header{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-md);padding:var(--spacing-md) var(--spacing-lg);border-bottom:1px solid var(--glass-border);background:var(--glass-bg);flex-shrink:0}.preview-filename{display:flex;align-items:center;gap:var(--spacing-sm);min-width:0}.preview-filename-icon{font-size:1.1rem;flex-shrink:0}.preview-filename-text{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.preview-header-actions{display:flex;align-items:center;gap:var(--spacing-sm);flex-shrink:0}.preview-close-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:#ffffff0f;border:1px solid var(--glass-border);border-radius:var(--radius-full);color:var(--color-text-muted);cursor:pointer;font-size:var(--font-size-sm);transition:all var(--transition-fast)}.preview-close-btn:hover{background:#ff505026;border-color:#ff505066;color:#f88}.preview-body{flex:1;overflow:auto;display:flex;align-items:center;justify-content:center;min-height:200px;max-height:75vh;padding:var(--spacing-md)}.preview-image-wrap{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.preview-image{max-width:100%;max-height:68vh;object-fit:contain;border-radius:var(--radius-md);box-shadow:var(--shadow-lg)}.preview-video-wrap{width:100%;display:flex;justify-content:center}.preview-video{max-width:100%;max-height:68vh;border-radius:var(--radius-md);outline:none}.preview-audio-wrap{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-md);padding:var(--spacing-xl)}.preview-audio-icon{font-size:4rem}.preview-audio-name{font-size:var(--font-size-md);font-weight:600;color:var(--color-text-primary)}.preview-audio{width:100%;max-width:480px;accent-color:var(--color-accent-solid)}.preview-text-wrap{width:100%;height:100%;overflow:auto}.preview-text{font-family:JetBrains Mono,Fira Code,Consolas,monospace;font-size:.8rem;line-height:1.7;color:var(--color-text-secondary);white-space:pre-wrap;word-break:break-all;margin:0;padding:var(--spacing-sm)}.preview-unsupported{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-md);padding:var(--spacing-xl);color:var(--color-text-muted);text-align:center}.preview-unsupported-icon{font-size:3rem}.file-preview-btn{background:none;border:none;cursor:pointer;padding:4px 6px;border-radius:var(--radius-sm);font-size:.9rem;color:var(--color-text-muted);transition:all var(--transition-fast);opacity:0;flex-shrink:0}.file-item:hover .file-preview-btn{opacity:1}.file-preview-btn:hover{background:#6c63ff26;color:var(--color-accent-solid)}@media (max-width: 560px){.preview-modal{max-height:95vh;border-radius:var(--radius-lg)}.preview-filename-text{max-width:140px}}.toast-container{position:fixed;bottom:var(--spacing-lg);right:var(--spacing-lg);z-index:999;display:flex;flex-direction:column;gap:var(--spacing-sm);pointer-events:none}.toast{display:flex;align-items:center;gap:var(--spacing-sm);padding:12px var(--spacing-md);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:var(--shadow-lg);max-width:360px;pointer-events:all;border:1px solid;animation:slideInRight .25s ease forwards}@keyframes slideInRight{0%{transform:translate(110%);opacity:0}to{transform:translate(0);opacity:1}}.toast--success{background:#14b46426;border-color:#14b46466;color:#4ade80}.toast--error{background:#ff50501f;border-color:#ff505059;color:#f88}.toast--info{background:#6c63ff1f;border-color:#6c63ff59;color:var(--color-text-accent)}.toast-icon{font-size:1rem;flex-shrink:0}.toast-message{flex:1;font-size:var(--font-size-sm);font-weight:500;line-height:1.4}.toast-close{background:none;border:none;color:inherit;cursor:pointer;padding:2px 4px;font-size:var(--font-size-xs);opacity:.6;transition:opacity var(--transition-fast);flex-shrink:0}.toast-close:hover{opacity:1}.folder-toggle-btn{background:none;border:none;color:var(--color-text-muted);cursor:pointer;font-size:.65rem;padding:2px 4px;flex-shrink:0;transition:color var(--transition-fast);line-height:1}.folder-toggle-btn:hover{color:var(--color-text-accent)}.folder-icon-clickable,.folder-name-clickable{cursor:pointer;-webkit-user-select:none;user-select:none}.folder-name-clickable:hover{color:var(--color-text-accent)}.convert-btn-group{display:flex;align-items:center;gap:6px}.convert-label{font-size:var(--font-size-xs);color:var(--color-text-muted);white-space:nowrap}.convert-btn-group .btn{min-width:48px;font-weight:700;letter-spacing:.5px}@media (max-width: 480px){.toast-container{bottom:var(--spacing-md);right:var(--spacing-sm);left:var(--spacing-sm)}.toast{max-width:100%}}