.dropzone{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-4);min-height:280px;padding:var(--space-10) var(--space-8);background:var(--color-surface);border:1.5px dashed var(--color-border);border-radius:var(--radius-xl);cursor:pointer;transition:all var(--transition-normal);text-align:center;overflow:hidden}.dropzone:before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:300px;height:300px;background:radial-gradient(circle,var(--color-accent-glow-2) 0%,transparent 70%);pointer-events:none;transition:opacity var(--transition-slow)}.dropzone:hover{border-color:var(--color-text-tertiary);background:var(--color-surface-2)}.dropzone:hover:before{background:radial-gradient(circle,var(--color-accent-glow) 0%,transparent 70%)}.dropzone--active{border-color:var(--color-accent)!important;background:var(--color-surface-2)!important;box-shadow:0 0 0 4px var(--color-accent-glow-2),var(--shadow-accent)}.dropzone--active:before{background:radial-gradient(circle,rgba(79,142,247,.2) 0%,transparent 70%)}.dropzone--active .dropzone__icon{color:var(--color-accent);transform:scale(1.1) translateY(-4px)}.dropzone--staged{border-color:var(--color-success);border-style:solid}.dropzone__icon{width:48px;height:48px;color:var(--color-text-tertiary);transition:all var(--transition-normal)}.dropzone__title{font-size:var(--text-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);letter-spacing:var(--letter-spacing-tight)}.dropzone__subtitle{font-size:var(--text-sm);color:var(--color-text-secondary)}.dropzone__hint{font-size:var(--text-xs);color:var(--color-text-tertiary);letter-spacing:var(--letter-spacing-wide);margin-top:var(--space-2)}.dropzone__browse{color:var(--color-accent);cursor:pointer;transition:color var(--transition-fast)}.dropzone__browse:hover{color:#fff}.staged-files{width:100%;display:flex;flex-direction:column;gap:var(--space-2);max-height:200px;overflow-y:auto;margin-top:var(--space-2)}.staged-file{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-3);background:var(--color-surface-hover);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--text-sm)}.staged-file svg{width:14px;height:14px;color:var(--color-success);flex-shrink:0}.staged-file__name{flex:1;color:var(--color-text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.staged-file__size{color:var(--color-text-tertiary);flex-shrink:0}.staged-file__remove{width:20px;height:20px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);color:var(--color-text-tertiary);cursor:pointer;transition:all var(--transition-fast);border:none;background:none;flex-shrink:0}.staged-file__remove:hover{color:var(--color-danger);background:var(--color-danger-dim)}.staged-file__remove svg{width:12px;height:12px;color:inherit}#file-input{display:none}.upload-progress{width:100%;display:flex;flex-direction:column;gap:var(--space-2)}.upload-progress__bar-track{width:100%;height:3px;background:var(--color-border);border-radius:var(--radius-full);overflow:hidden}.upload-progress__bar-fill{height:100%;background:var(--color-accent);border-radius:var(--radius-full);transition:width .3s ease;box-shadow:0 0 8px #4f8ef799}.upload-progress__text{font-size:var(--text-xs);color:var(--color-text-secondary);text-align:center}@media (max-width: 640px){.dropzone{min-height:180px;padding:var(--space-6) var(--space-4);gap:var(--space-3)}.dropzone__icon{width:36px;height:36px}.dropzone__title{font-size:var(--text-md)}.dropzone__subtitle{font-size:var(--text-xs)}.dropzone__hint{font-size:10px;margin-top:var(--space-1)}}